attr ('defaultValue') возвращает неопределенное значение, используя jQuery 1.6.3

Question

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

http://jsfiddle.net/kHBsD/

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

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

Нетошибки сценария в консоли и другие аспекты функции работоспособны. Вы можете видеть, что часть 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.

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

Answer 1

Использование prop():

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

Демо: http://jsfiddle.net/kHBsD/8/

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

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

---

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

Когда браузер анализирует исходный код HTML, интерпретируется элемент HTML <input> и создается соответствующий узел HTMLInputElement DOM. Этот элемент 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, поэтому вы можете просто получить доступ к свойству напрямую. Также эти обработчики не нужны, просто используйте input:hover правило CSS.

Answer 2

var x=$('#q').prop('defaultValue');