jQuery текст по умолчанию / ввод заполнителя и проблемы с сохраненной информацией

Question

Я новичок в jQuery и у меня раздражающая проблема. У меня есть несколько полей для входа, которые заполняются текстом по умолчанию, когда поле пустое, а затем удаляются при нажатии.

Моя проблема заключается в том, что когда пользователь сохраняет свое имя пользователя / пароль (в браузере), если они возвращаются на страницу, поля входа в систему заполняются как сохраненными данными пользователя, так и данными по умолчанию.

$('#login input.text').each(function(i, field) {
            field = $(field);
            if (field.val().length > 0) {
                field.prev().css('display', 'none');
            }
            field.focus(function() {
                field.prev().css('display', 'none');
            }).blur(function() {
                if (field.val() == '') field.prev().css('display', 'block');
            });
        })

Answer 1

Я бы рекомендовал использовать атрибут-заполнитель html5.

<input type="text" placeholder="username" name="username">

Майк Тейлор написал отличный плагин jQuery для поддержки браузеров, которые еще не поддерживают этот атрибут. http://github.com/miketaylr/jQuery-html5-placeholder

Answer 2

Я бы пошел на что-то вроде этого, чтобы иметь значения по умолчанию вместо того, чтобы показывать скрытие чего-то рядом с полями. Конечно, вы можете использовать любой пользовательский атрибут вместо имени, но логин и пароль выглядят хорошо:

$(function(){ 
    $('#login input.text').each(function() {
        var field = $(this);
        if (!!field.val() && field.val() !=field.attr('name')) {
            field.val(field.attr('name'));
        }
    }).focus(function() {
        var field = $(this);
        if (field.val() == field.attr('name')) field.val('');
    }).blur(function() {
        var field = $(this);
        if (!!field.val()) field.val(field.attr('name'));
    });

});