Advanced Search

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

/ Published in: jQuery
Save to your folder(s)
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 
  1. $('.default-value').each(function() {
  2.     var default_value = this.value;
  3.     $(this).focus(function() {
  4.         if(this.value == default_value) {
  5. 	    this.value = '';
  6. 	    $(this).css('color', '#000');
  7.         }
  8.     });
  9.     $(this).blur(function() {
  10.         if(this.value == '') {
  11.             $(this).css('color', '#999');
  12. 	    this.value = default_value;
  13. 	}
  14.     });
  15. });

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.