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

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进入这个回调函数。这有点棘手但很有用；谷歌一下 JS 中的闭包，有很多很好的解释。