jquery - JQuery - 来自 .data() 的数据丢失

Question

我在创建锚点、存储数据并将其附加到 div 元素的函数中有此代码

var x = $("<a class='randomclass'></a>");
x.data('foo', 'bar');
console.log(x.data());
...
$("<div></div>").append(
    x
);
...

现在，当我尝试使用一个事件处理程序来获取该数据时，它显示它未定义。我尝试了不同的方法来访问元素，但它们都没有返回数据

$("body").on("click", "a.randomclass", function (event) {
   event.preventDefault();
   console.log( $(event.target).data('foo') );
   console.log( $(event.currentTarget).data('foo') );
   console.log( $(this).data('foo') );
});

为什么会这样？

编辑：修正错字。

Answer 1

好的，我想我找到了答案。

问题是我使用 .html() 获得了元素的标记并将其传递给函数。

我想这意味着该元素的任何数据都会丢失，因为 .html() 只是获取该元素的字符串表示形式。

Answer 2

似乎对我有用。jsFiddle

var x = $("<a class='randomclass'>test link</a>");
x.data('foo', 'bar');
console.log(x.data());

$("body").append(x);

$("body").on("click", "a.randomclass", function(event) {
    event.preventDefault();
    console.log($(this).data());
});​