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

Question

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

请查看以下示例：

这个有效（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 对象，与分配的第一个对象不同。

Answer 2

我不完全确定为什么会这样，但是所有的 jQuery 文档都显示了 jQuery 对象在作为函数中的参数传递之前作为变量编写。

请参阅：http ://learn.jquery.com/using-jquery-core/jquery-object/

我只是在学习更多关于 JavaScript 的知识，但我感觉 jQuery 对象本身$("#officerBob")本质上是一个函数。您的代码利用该函数的输出，并不期望将函数作为输入。它期待一个对象。

因此，一旦您将输出封装为一个对象，（通过创建一个其值等于函数输出的对象）您的代码就可以工作。