I want a textarea with some default text. When the user clicks in the textarea the default text should be deleted. How can I make value of a textarea disappear on click?
I want it exactly like this, http://www.webune.com/forums/20101025cgtc.html
But I wish it made in jQuery.
<textarea id="textarea">This should be removed..</textarea>
I use this as its a bit more generic - it will clear out the element's value on focus, but return the element's value to the default value if empty.
$("#textarea")
.focus(function() {
if (this.value === this.defaultValue) {
this.value = '';
}
})
.blur(function() {
if (this.value === '') {
this.value = this.defaultValue;
}
});
You can accomplish this even without JavaScript by using placeholder
attribute.
But you should be aware that not every browser supports it yet. In this case you can use for instance this plugin: http://plugins.jquery.com/project/input-placeholder
Very simple non-jQuery-dependent solution:
<textarea onfocus="if(this.value==this.defaultValue)this.value=''" onblur="if(this.value=='')this.value=this.defaultValue">Hello World</textarea>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With