How to show form input values onblur and hide onfocus

There are two ways to make text input value show onblur and hide onfocus. The first one uses a JavaScript at the head tag of your web page, while the second one uses a script on the input tag itself.

First Method (with JavaScript)

Write the script below inside the head tag of your page.

After that, use the following codes:

The XXX will serve as the input value.

Second Method (no JavaScript)

This method only use this script:

Where XXX is the input value.

The first method is ideal if you have lot of fields on a single page, while the second method is applicable if you only have few fields.

Here’s also a script to show values for textarea onblur and hide onfocus.

View demo of show/hide input value onblur/onfocus.