Advanced Search

Clear Text Javascript Drupal Behavior

/ Published in: JavaScript
Save to your folder(s)
Takes any field with the class .clear-text and makes it clear it's default text (ex: 'search here') when it is focused on. If nothing is changed or the field is left blank, the original text appears when focus leaves the field.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. Drupal.behaviors.clearText = function(context) {
  2. 	var inputs = $('input.clear-text:not(.processed)');
  3.  
  4. 	// Store the original values
  5. 	inputs.each(function() {
  6. 		$this = $(this);
  7. 		$this.data('default', $this.val());
  8. 	}).addClass('processed');
  9.  
  10. 	// Set up inputs to clear on focus & reload default (if blank) on blur
  11. 	inputs
  12. 		.focus(function() {
  13. 			$this = $(this);
  14. 			if ( $this.val() == $this.data('default') ) {
  15. 				$this.val('');
  16. 			}
  17. 		})
  18. 		.blur(function() {
  19. 			$this = $(this);
  20. 			if ( $this.val() == '' ) {
  21. 				$this.val( $this.data('default') );
  22. 			}
  23. 		});
  24. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.