veselov.sumy.ua > JavaScript > Очистка поля input при фокусе на jQuery

Очистка поля input при фокусе на jQuery


07.05.11.
Очистка поля input при фокусе на jQuery

HTML
<input name="variable_name_1" type="text" value="Текст подсказки" class="autoclear" />

CSS
.autoclear { color: #aaa; }
.autoclear-normalcolor { color: #000; }

JS jQuery
$(function() {
    $.fn.autoClear = function () {
        // сохраняем во внутреннюю переменную текущее значение
        $(this).each(function() {
            $(this).data("autoclear", $(this).attr("value"));
        });
        $(this)
            .bind('focus', function() {   // обработка фокуса
                if ($(this).attr("value") == $(this).data("autoclear")) {
                    $(this).attr("value", "").addClass('autoclear-normalcolor');
                }
            })
            .bind('blur', function() {    // обработка потери фокуса
                if ($(this).attr("value") == "") {
                    $(this).attr("value", $(this).data("autoclear")).removeClass('autoclear-normalcolor');
                }
            });
        return $(this);
    }
});

$(function() {
    // привязываем плагин ко всем элементам с классом "autoclear"    
    $('.autoclear').autoClear();
});

ДЕМО

Вернуться назад