Невозможно вызвать $ .data для объекта внутри функции - PullRequest
Новая
       27

Невозможно вызвать $ .data для объекта внутри функции

1 голос
/ 22 апреля 2011

Я играю с функцией jQuery $.data и сталкиваюсь с некоторыми проблемами.Если я сделаю так: 

(function($){
    $.fn.testData = function() {
         var obj = $(this);
         obj.text($.data(obj,'test')); 
    }
})(jQuery);

var element = $("#test");
$.data(element,'test','hej');
element.testData();

, это будет неопределенным.Почему?

РЕДАКТИРОВАТЬ:

Это прекрасно работает, если я использую функцию elem.data(key), например: 

(function($){
    $.fn.testData = function() {
         var obj = $(this);
         obj.text(obj.data('test')); 
    }
})(jQuery);

var element = $("#test");
element.data('test','hej');
element.testData();

, но я простоувидел слайд-шоу Пола Айриша, который утверждает, что elem.data в 10 раз медленнее, чем $.data(elem): http://paulirish.com/2009/perf/

Ответы [ 3 ]

2 голосов
/ 22 апреля 2011 
(function($){
    $.fn.testData = function() {
         var obj = $(this);
         obj.text($.data(obj[0],'test'));
    }

    var element = $("#test");
    $.data(element[0],'test','hej');
    element.testData();
})(jQuery);

Вот jsFiddle: http://jsfiddle.net/TdJHq/

1 голос
/ 22 апреля 2011

jQuery.data ( doc jQuery.data ) работает с элементами DOM, а не с элементами jQuery. Таким образом, вы должны извлечь реальный элемент под вашим селектором jQuery. 

obj.text($.data(obj[0],'test'));

Это то, что объяснил @alexl.

Но есть также метод .data () , который работает с селектором jQuery, поэтому вы можете использовать: 

// getter
obj.text($obj.data('test'));
// setter
obj.text($obj.data('test','toto'));

И вы, возможно, смешали оба.

1 голос
/ 22 апреля 2011

Проблема в том, что вы создаете разные объекты для присоединения и извлечения данных. Каждый раз, когда вы вызываете $(selector), вы создаете новый объект jQuery, и это будет отличаться от того, к которому вы прикрепили данные.

Вот простой пример: 

$.data($('#test'),'test','hej');
alert($.data($('#test'),'test'));

Это даст вам undefined.

Именно поэтому $.data ожидает элемент DOM, а не объект jQuery. Независимо от того, как вы извлекаете определенный элемент DOM, ссылка всегда одна и та же.

Так что либо передайте элемент DOM ($('#test')[0]), либо лучше , используйте $('#test').data().

...