CODEWITHSUNDEEP
javascripthtmlformsplaceholdercontact-form
BigTech
BigTech

Reputation: 460

Apply script for placeholder in contact form 7

I am using this HTML code to display contact form:

<input type="text" onblur="if(this.value=='')this.value='Name:';" onfocus="if(this.value=='Name:')this.value='';" value="Name:" name="name">
    <input type="text" onblur="if(this.value=='')this.value='Phone:';" onfocus="if(this.value=='Phone:')this.value='';" value="Phone:" name="phone">
        <input type="text" onblur="if(this.value=='')this.value='Email:';" onfocus="if(this.value=='Email:')this.value='';" value="Email:" name="email">
        <textarea onfocus="if(this.value=='Message!')this.value='';" onblur="if(this.value=='')this.value='Message!';">Message!</textarea>
        <input type="submit" value="SUBMIT" class="sub_btn"/>

In this form my placeholder working well. Means when mouse focus placeholder disappear but when mouse out placeholder appear again. I want same in contact form 7.

Question:

How can I apply this script on contact form 7 fields. onfocus="if(this.value=='Message!')this.value='';" onblur="if(this.value=='')this.value='Message!';"

Upvotes: 0

Views: 2012

Answers (1)

naazgull
naazgull

Reputation: 670

for textareas, the value attribute doesn't work. You should use something like (didn't test this snippet):

onfocus="if(this.textContent=='Message!')this.innerHTML='';"
onblur="if(this.textContent=='')this.innerHTML='Message!';"

The textContent attribute is analogue to innerHTML but it strips the content from HTML tags.

cheers,

Upvotes: 1

Related Questions