javascript - 当参数中显式命名元素时，Jquery Data 函数返回未定义的值

Question

我正在使用 jquery 的“data”函数来存储与 HTML 元素关联的一些信息。当在整个函数中显式引用此元素时，该函数返回未定义，但是当我将该元素绑定(bind)到变量时，该函数工作得很好。

请查看下面的示例:

这个有效(http://jsfiddle.net/sdbA5/):

  $(function() {

    var div = $("#officerBob");

    jQuery.data( div, {
      arrests: 16
    });

    div.click(function(){
       alert("Bob has " + jQuery.data( div ).arrests + " arrests");
    });

});

而这个则没有 ( http://jsfiddle.net/5Y6b8/1/ ):

  $(function() {

    //var div = $("#officerBob");

    jQuery.data( $("#officerBob"), {
      arrests: 16
    });

    $("#officerBob").click(function(){
       alert("Bob has " + jQuery.data( $("#officerBob") ).arrests + " arrests");
    });

});

Answer 1

jQuery.data() 应该在 DOM 节点而不是 jQuery 集合上工作。

更改代码以使用 DOM 节点，它将开始工作

$(function() {

    jQuery.data( $("#officerBob")[0], {
      arrests: 16
    });

    $("#officerBob").click(function(){
       alert("Bob has " + jQuery.data( $("#officerBob")[0] ).arrests + " arrests");
       alert("Bob has " + jQuery.data( this ).arrests + " arrests");
    });

});

现在为什么第一个会起作用？因为它正在处理同一个对象。在第二个中，它是一个新的 jQuery 对象，与分配的第一个对象不同。