Attr ('defaultValue') возвращает undefined с помощью jQuery 1.6.3

У меня есть простой script в jQuery, который отлично работает с jQuery 1.5.2, как вы можете видеть в этом jsFiddle. Предполагается, что при переносе фокуса в текстовое поле значение по умолчанию удаляется. И если, если оставить поле пустым, исходное значение по умолчанию будет вставлено на место.

http://jsfiddle.net/kHBsD/

Однако тот же самый точный код, где используется только jQuery 1.6.3, не работает. (Не работает означает, что значение по умолчанию остается в текстовом поле, пока вы не удалите его вручную, как вы можете видеть в этом jsFiddle.

http://jsfiddle.net/kHBsD/1/

В консоли отсутствуют ошибки script, и другие функции функции работают. Вы можете видеть, что часть hover() работает нормально как в jsFiddles.

Обобщенная версия (проблема с корнем)

jQuery 1.6.3 возвращает undefined для .attr('defaultValue').

jsFiddle с помощью jQuery 1.6.3 (не работает)

Однако jQuery 1.5.2 возвращает ожидаемое значение для .attr('defaultValue').

jsFiddle с помощью jQuery 1.5.2 (рабочий)

Вопрос:

Кто-нибудь знает, почему это происходит? (Это выглядит как ошибка jQuery для меня.)

Далее все еще работает...

document.getElementById().defaultValue

... но я думаю, что это довольно уродливо, когда нужно сделать это, где доступен jQuery.

Я открыт для других предложений.

Ответ 1

Используйте prop():

$( '#q' ).prop( 'defaultValue' )

Живая демонстрация: http://jsfiddle.net/kHBsD/8/

Вы видите, 'defaultValue' не является атрибутом контента (атрибутом HTML), как вы можете убедиться сами, если вы посмотрите на свой исходный код HTML. Вместо этого это свойство элемента DOM HTMLInputElement node.

Смотрите здесь: https://developer.mozilla.org/en/DOM/HTMLInputElement

Атрибуты существуют в исходном коде HTML.
Свойства существуют в дереве DOM.

Когда браузер анализирует исходный код HTML, элемент HTML <input> интерпретируется и создается соответствующий HTMLInputElement DOM node. Этот элемент DOM содержит десятки свойств ('defaultValue' является одним из них).

Здесь я переработал ваш код:

$( '.autoclear' ).
    focus( function () {
        if ( this.value === this.defaultValue ) {
            this.value = '';
            $( this ).removeClass( 'blur' ).addClass( 'focus' );
        }
    }).
    blur( function () {
        if ( this.value === '' ) { 
            this.value = this.defaultValue;
            $( this ).removeClass( 'focus' ).addClass( 'blur' );
        }
    });

Живая демонстрация: http://jsfiddle.net/kHBsD/9/

prop() не требуется - у вас есть ссылка this, поэтому вы можете просто получить доступ к свойству напрямую. Также эти обработчики hover не нужны, просто используйте правило CSS input:hover.

Ответ 1

Ответ 2