Question

也许我错误地使用了$ .data。

分配数据：

var course_li = sprintf('<li class="draggable course">%s</li>', course["fields"]["name"]);

$(course_li).data('pk', course['pk']);
alert(course['pk']); // shows a correct value

alert($(course_li).data('pk')); // shows null. curious...

course_li稍后会附加到DOM。

将li移至其他ul：

function moveToTerm(item, term) {
    item.fadeOut(function() {
        item.appendTo(term).fadeIn();
    });
}

稍后尝试访问数据：

$.each($(term).children(".course"), function(index, course) {
      var pk = $(course).data('pk');
      // pk is undefined
      courses.push(pk);
});

我做错了什么？我已经确认我设置数据的课程li与我正在寻找的课程相同。（除非我通过在其上调用appendTo()来弄乱它？）

Answer 1

存储数据时：

$(course_li).data('pk', course['pk']);

你正在创建一个元素但不保存它，所以它丢失了。您的警报测试测试错误的值;它应该是：

$(course_li).data('pk', course['pk']);
alert($(course_li).data('pk'));

是null。考虑：

$(course_li);
$(course_li);

这会创建两个不同的元素，其源代码为course_li，然后会立即丢失。您需要做的是首先创建元素，然后使用该单个元素（即不要多次调用$(course_li)）。例如，

var course_li = $(sprintf('<li class="draggable course">%s</li>', 
                          course["fields"]["name"]));
course_li.data('pk', course['pk']);
parent.append(course_li);

请注意，course_li现在包含一个元素，而不是一个字符串。

Answer 2

尝试检查此调用是否正在创建元素：

$(course_li)

是单个'li'元素或div。来自doco：

当HTML比没有属性的单个标签更复杂时，就像在上面的示例中那样......剪切...具体来说，jQuery创建一个新的＆lt; div＆gt; element并将元素的innerHTML属性设置为
中传递的HTML片段

所以它可能正在创建一个你要分配数据的div，所以当你选择'li'本身时，你得到的是你设置数据的实际元素的子元素。

jQuery $ .data（）：可能误用？

2 个答案: