jquery input title hint

jQuery.fn.inputHints=function() {
    // hides the input display text stored in the title on focus
    // and sets it on blur if the user hasn't changed it.

    // show the display text
    jQuery(this).each(function(i) {
        jQuery(this).val(jQuery(this).attr('title')).addClass('hint');
    });

    // hook up the blur & focus
    return jQuery(this).focus(function() {
        if (jQuery(this).val() == jQuery(this).attr('title')){
            jQuery(this).val('').removeClass('hint');
        }
    }).blur(function() {
        if (jQuery(this).val() === ''){
            jQuery(this).val(jQuery(this).attr('title')).addClass('hint');
        }
    });
};

jQuery(document).ready(function() {
    jQuery('input[title]').inputHints();
});

Leave a Reply

Your email address will not be published. Required fields are marked *