Java-Scripts.net

Auto Clear Field

Improve user experience. This script simulates the behavior of the modern "placeholder" attribute using JavaScript, clearing default text when focused and restoring it if left empty.

Copy the Script

<script>
function clearField(field) {
    if (field.defaultValue == field.value) {
        field.value = "";
    }
}

function restoreField(field) {
    if (field.value == "") {
        field.value = field.defaultValue;
    }
}
</script>

<input type="text" value="Search here..." 
       onfocus="clearField(this)" 
       onblur="restoreField(this)">

Frequently Asked Questions

The HTML5 `placeholder` attribute is the modern standard and preferred method. This JavaScript solution is useful for legacy browser support or if you want the text to behave like a value rather than a hint.

Yes. You just need to apply the `onfocus` and `onblur` event listeners to the `