How to clear textarea on click?

Karem picture Karem · May 6, 2010 · Viewed 177.3k times · Source

Given a <textarea> with a default value as follows:

<textarea>Please describe why</textarea>

How do you clear the default value when the user clicks to edit the field?

Answer

Dolph picture Dolph · May 6, 2010

Your JavaScript:

function clearContents(element) {
  element.value = '';
}

And your HTML:

<textarea onfocus="clearContents(this);">Please describe why</textarea>

I assume you'll want to make this a little more robust, so as to not wipe user input when focusing a second time. Here are five related discussions & articles.

And here's the (much better) idea that David Dorward refers to in comments above:

<label for="explanation">Please describe why</label>
<textarea name="explanation" id="explanation"></textarea>