[javascript] Onclick event to remove default value in a text input field

I have an input field:

<input name="Name" value="Enter Your Name">

How would I get it to remove the pre-defined text (Enter Your Name) when the user clicks the box.

As far as I am aware Javascript is the best way to do this. If that wrong please inform me.

This question is related to javascript html

The answer is


You actually want to show a placeholder, HTML 5 offer this feature and it's very sweet !

Try this out :

<input name="Name" placeholder="Enter Your Name">

As stated before I even saw this question placeholder is the answer. HTML5 for the win! But for those poor unfortunate souls that cannot rely on that functionality take a look at the jquery plugin as an augmentation as well. HTML5 Placeholder jQuery Plugin

<input name="Name" placeholder="Enter Your Name">

This is the right, cross-browser way to do it :

<input type="text" value="Enter Your Name" onfocus="if(this.value  == 'Enter Your Name') { this.value = ''; } " onblur="if(this.value == '') { this.value = 'Enter Your Name'; } " />

u can use placeholder and when u write a text on the search box placeholder will hidden. Thanks

<input placeholder="Search" type="text" />

In addition to placeholder="your text" you could also do onclick="this.value='';

So it would look something like:

<input name="Name" value="Enter Your Name" onclick="this.value='';>

Use onclick="this.value=''":

<input name="Name" value="Enter Your Name" onclick="this.value=''">

This should do it:

HTML

<input name="Name" value="Enter Your Name" onClick="blankDefault('Enter Your Name', this)">

JavaScript

function blankDefault(_text, _this) {
    if(_text == _this.value)
        _this.value = '';
}

There are better/less obtrusive ways though, but this will get the job done.


<input name="Name" value="Enter Your Name" onfocus="freez(this)" onblur="freez(this)">


function freez(obj)
{
 if(obj.value=='')
 {
   obj.value='Enter Your Name';
 }else if(obj.value=='Enter Your Name')
 {
   obj.value='';
 }
}