// $Id$ /** * @file * Form elements title module JS * * Use the title HTML attribute from form elements to set a textual default * value that blurs when user get focus in it. * * Modified code from http://drupal.org/node/401366 * Thanks to chriscalip (http://drupal.org/user/210499) for his codebase. */ Drupal.behaviors.fetitle = function(context) { $('input').each(function(){ switch (this.type) { case 'text': case 'textarea': $(this).hint(); break; default: // Pass } }); }; jQuery.fn.hint = function (blurClass) { if (! blurClass) { blurClass = 'blur'; } return this.each(function () { // get jQuery version of 'this' var $input = jQuery(this), // capture the rest of the variable to allow for reuse title = $input.attr('title'), $form = jQuery(this.form), $win = jQuery(window); function remove() { if ($input.val() === title && $input.hasClass(blurClass)) { $input.val('').removeClass(blurClass); } } // only apply logic if the element has the attribute if (title) { // on blur, set value to title attr if text is blank $input.blur(function () { if (this.value === '') { $input.val(title).addClass(blurClass); } }).focus(remove).blur(); // now change all inputs to title // clear the pre-defined text when form is submitted $form.submit(remove); $win.unload(remove); // handles Firefox's autocomplete } }); };