Posted By

f6design on 02/25/11

Tagged

form

Versions (?)

Last Edited at 02/25/11 05:15pm

Statistics

Viewed 2385 times

Favorited by 3 user(s)

Related snippets

Remove/restore a form field's default value on focus/blur

/ Published in: jQuery

If your HTML form fields have a 'watermark' default value, it will be removed when the field is focussed and replaced if focus is lost (and the user has left the field blank).

To use give your form field a class of 'default-value'

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

$('.default-value').each(function() {
    var default_value = this.value;
    $(this).focus(function() {
        if(this.value == default_value) {
	    this.value = '';
	    $(this).css('color', '#000');
        }
    });
    $(this).blur(function() {
        if(this.value == '') {
            $(this).css('color', '#999');
	    this.value = default_value;
	}
    });
});

Report this snippet Tweet

Comments

You need to login to view comments.