Question

我想在一个元素上存储一些任意数据，以便在ajax回调中使用，如下所示：

$(this).data('my_data', 'hey there');
$(this).click(function(e) {
    e.preventDefault();
    // $(this).data('my_data') == 'hey there'  :-)
    $.post($(this).attr('href'), '...', function(response) {
        // $(this).data('my_data') == undefined  :-(
    });
});

但是在回调中'my_data'是未定义的。我只是做错了什么或者这不起作用？最好的方法是什么？

感谢。

Answer 1

this回调函数的上下文中的

post与click回调的上下文中的

// here `this` == some object $(this).data('my_data', 'hey there'); $(this).click(function(e) { // here `this` == the same object, // because the click event handler is called in the context // of that object // a local variable to be contained in the closure var that = this; $.post($(this).attr('href'), '...', function(response) { // here `this` is something else, but now you can... $(that).data('my_data'); }); });不同。

我通过创建闭包来解决这个问题：

that

closure magic将局部变量{{1}}的范围扩展到此回调函数中。这有点棘手但有用;有一个关于JS的闭包谷歌有许多优秀的解释。

Answer 2

this的回调函数中的

$.post不会绑定到您的链接。您需要创建对要在回调中使用的链接的引用。

var $this = $(this);
$this
  .data('my_data', 'hey there')
  .click(function(e) {
    e.preventDefault();
    // $(this).data('my_data') == 'hey there'  :-)
    $.post($this.attr('href'), '...', function(response) {
        // $this.data('my_data') == 'hey there'  :-)
    });
});

Answer 3

data（）函数是jQuery超级对象的一个方法，并没有绑定到元素。直接取自jQuery.data() docs。（我希望我措辞正确）

<script>
    var div = $("div")[0];
    jQuery.data(div, "test", { first: 16, last: "pizza!" });
    $("span:first").text(jQuery.data(div, "test").first);
    $("span:last").text(jQuery.data(div, "test").last);
</script>

jquery存储要在回调中使用的任意元素数据

3 个答案: