How to show/hide input value on focus?

Question

I see this all over the web, but was wondering if anyone has the JavaScript code for the EASIEST way to show input value on blur, but hide in on focus.

Answer 1

If you don’t care about valid HTML, you use the placeholder attribute. It will work out of the box on a Safari, and you can add some unobtrusive JS to mimic this behavior in other browsers.

More reading:

• http://www.beyondstandards.com/archives/input-placeholders/ (JS implementation)
• http://lab.dotjay.co.uk/experiments/forms/input-placeholder-text/

And google. ;-)

The solution is similar to the one Josh Stodola posted, but it’s more flexible and universal.