Ajax jquery 成功范围

Question

我有这个对doop.php 的ajax 调用。

    function doop(){
        var old = $(this).siblings('.old').html();
        var new = $(this).siblings('.new').val();

        $.ajax({
            url: 'doop.php',
            type: 'POST',
            data: 'before=' + old + '&after=' + new,
            success: function(resp) {
                if(resp == 1) {
                    $(this).siblings('.old').html(new);
                }
            }
        });

        return false;
    }

我的问题是 $(this).siblings('.old').html(new); 行没有做它应该做的事情。

谢谢.. 所有有用的 cmets/answers 都会被投票。

更新：看来问题的一半是范围（感谢帮助我澄清这一点的答案），但另一半是我试图在同步中使用 ajax方式。我创建了一个新帖子

Answer 1

你应该使用http://api.jquery.com/jQuery.ajax/中的context设置

function doop(){
    var old = $(this).siblings('.old').html();
    var newValue = $(this).siblings('.new').val();

    $.ajax({
        url: 'doop.php',
        type: 'POST',
        context: this,
        data: 'before=' + old + '&after=' + newValue,
        success: function(resp) {
            if(resp == 1) {
                $(this).siblings('.old').html(newValue);
            }
        }
    });

    return false;
}

“this”将转移到成功范围，并按预期执行。

Answer 2

首先new 是a reserved word。您需要重命名该变量。

要回答您的问题，是的，您需要将 this 保存在成功回调外部的变量中，并在您的成功处理程序代码中引用它：

var that = this;
$.ajax({
    // ...
    success: function(resp) {
        if(resp == 1) {
            $(that).siblings('.old').html($new);
        }
    }
})

这称为closure。

Answer 3

this 绑定到应用了执行函数的对象。这可能是一些 AJAX 响应对象，或者全局对象 (window)，或者其他东西（取决于 $.ajax 的实现。

是否需要在进入 $.ajax 调用之前将 $(this) 捕获到变量中，然后将其作为参数传递给 $.ajax 调用？还是我需要将它传递给匿名成功函数？如果这样可以解决问题，我应该在哪里将它传递给 $.ajax？

在定义success 函数之前，您确实需要一种方法来捕获this 的值。创建闭包是执行此操作的方法。您需要定义一个单独的变量（例如self）：

function doop() {
    var old = $(this).siblings('.old').html();
    var new = $(this).siblings('.new').val();

    var self = this;

    $.ajax({
        url: 'doop.php',
        type: 'POST',
        data: 'before=' + old + '&after=' + new,
        success: function(resp) {
            if(resp == 1) {
                $(self).siblings('.old').html(new);
            }
        }
    });

    return false;
}

success 函数在调用时将保留 self 的值，并且应该按预期运行。