javascript - 在 jQuery 中，如何从 $.ajax 回调函数访问 $(this)？

Question

可能重复：
如何访问 $(this) inside ajax 成功回调函数

我有这样的代码：

$('.each_button').click(function(){

$.ajax({ type: 'POST', url: process.php, data: data, success: function(data){

/////
       }
   })
});

如何访问$('.each_button')触发事件的内容？我试过$(this)但它不起作用，可能是因为它在另一个函数中..

提前非常感谢。

Answer 1

出于某种原因，每个人都想使用变量。这是没有必要的。

$('.each_button').click(function(){

    $.ajax({
        context: this, // <-- do this instead...
        type: 'POST', 
        url: process.php, 
        data: data, 
        success: function(data) {
               // ...now 'this' is the element you want
            alert(this.className);
        }
    });

});

---

或者$.proxy，如果您愿意，可以使用...

$('.each_button').click(function(){

    $.ajax({
        type: 'POST', 
        url: process.php, 
        data: data, 
        success: $.proxy(function(data) {
               // ...now 'this' is the element you want
            alert(this.className);
        }, this) // <-- bind the context
    });

});

---

这些方法的一个好处是它可以让您重用该success功能......

function ajax_success(data) {
    alert(this.className);
}

$('.each_button').click(function(){
    $.ajax({
        context: this,
        type: 'POST', 
        url: process.php, 
        data: data, 
        success: ajax_success
    });
});

Answer 2

您可以将对象保存在另一个变量中并在function(data).

像这样的东西：

$('.each_button').click(function(){
    var $obj = $(this);
    $.ajax({
        type: 'POST', 
        url: process.php, 
        data: data, 
        success: function(data) {
            $obj.val(data.foobar);
        }
    })
});

Answer 3

在 ajax 调用之前在变量中捕获它：

$('.each_button').click(function(){

    var $this = $(this);

    $.ajax({ type: 'POST', url: process.php, data: data, success: function(data){

            alert($this);

       }
   })
});