CODEWITHSUNDEEP
textareaonbluronfocus
user780483
user780483

Reputation: 3063

textarea onclick remove text

I know how to remove text in a simple html textbox but html textareas seem much more complicated. instead of the value attribute you put the text right between:

 <html>
<textarea> </textarea>.  
</html>

This is why im having trouble making an onFocus and onBlur event.

Upvotes: 2

Views: 36919

Answers (4)

Jordan Foreman
Jordan Foreman

Reputation: 3888

what about calling a javascript function during the onFocus event?

function emptyText(){    
    document.getElementById(textarea).innerHTML = "";
}

Upvotes: 0

Rafael Ernica
Rafael Ernica

Reputation: 185

<textarea name="message" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;">
Put anything for default value here
</textarea>

Live example: http://jsfiddle.net/SRYLg/

Upvotes: 14

Lekensteyn
Lekensteyn

Reputation: 66465

A textarea behaves like other <input> elements (with type text or password), instead of having a value attribute, the value is between the <textarea> and </textarea> tags.

Accessing and modifying the contents of the textfield is no difference. The below code displays a textarea and an input box. The same function is used for accessing the values and modifying it. If the value equals to "example text" when entering the input, the text is cleared. If the textarea / input box is empty when leaving it, "example text" will be put in it.

<textarea id="field1">example text</textarea>
<input id="field2" value="example text">
<script>
function addEvents(id) {
    var field = document.getElementById(id);
    field.onfocus = function () {
        if (this.value == "example text") {
            this.value = "";
        } 
    };
    field.onblur = function () {
        if (this.value == "") {
            this.value = "example text";
        } 
    };
}
addEvents("field1");
addEvents("field2");
</script>

Upvotes: 1

Wicked Coder
Wicked Coder

Reputation: 1118

Your Javascript should have: 

function RemoveText(obj) 
{   obj.value = ''; }

And Your HTML element should have:

onfocus="RemoveText(this);"

Upvotes: 0

Related Questions