3

我正在使用带有 Jquery 的 ASP.NET MVC，这似乎是一个 jquery 错误。

我正在对我的方法进行 ajax 调用，我的代码是

$('.reopenBtn').live('click', function () {
    var taskId = $(this).attr("data-taskid");

    $.ajax({
        url: '/Task/ReopenTask/?strTaskId=' + taskId,
        type: "POST",
        success: function (data) {
            // this does not work !!
            $(this).parent().parent().closest("div").remove();              
        },
        error: function (xhr, ajaxOptions, thrownError) {
            alert('Error');
        }
    });
});

但是，在这里为这个问题创建一个 jsfiddle 时，这remove不起作用。

那么，$(this)ajax 调用的成功函数内部有什么不同吗？

我该如何解决这个问题？谢谢

4

3 回答 3

7

context属性将在 ajax 的成功函数中工作context: this,

$('.reopenBtn').live('click', function () {
    var taskId = $(this).attr("data-taskid");
    var self = this;
    $.ajax({
        url: '/Task/ReopenTask/?strTaskId=' + taskId,
        type: "POST",
        success: function (data) {
            $(self).parent().parent().closest("div").remove();              
        },
        error: function (xhr, ajaxOptions, thrownError) {
            alert('Error');
        }
    });
});

或者您可以设置contextajax 选项的属性。

    $('.reopenBtn').live('click', function () {
        var taskId = $(this).attr("data-taskid");
        $.ajax({
            url: '/Task/ReopenTask/?strTaskId=' + taskId,
            type: "POST",
            context: this,
            success: function (data) {
                $(this).parent().parent().closest("div").remove();              
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert('Error');
            }
        });
    });
于 2012-09-23T05:59:49.513 回答
1

我更喜欢这种方法，用 $.proxy 包装，两个参数是回调函数和this第二个参数。

$.post('/foo', data, $.proxy(function(d){
  // do stuff with data
}, this));

我认为它是最短和最干净的。

您也可以执行其他人在上面所说的操作，复制this到that(self是保留字) 然后在回调中使用，或者使用带有context: this参数的 $.ajax。

于 2012-09-23T06:25:50.787 回答
0

该方法的上下文与该click方法的上下文完全不同success。this因此，您在内部功能中没有相同的功能。您可以通过使用类似$thisor的局部变量来避免这种情况，clickedButton并在您的success方法中使用它：

$('.reopenBtn').live('click', function () {
  var $this = $(this)
  var taskId = $this.attr("data-taskid");

  $.ajax({
    url: '/Task/ReopenTask/?strTaskId=' + taskId,
    type: "POST",
    success: function (data) {
        // $this is taken from the outer function context
        $this.parent().parent().closest("div").remove();              
    },
    error: function (xhr, ajaxOptions, thrownError) {
        alert('Error');
    }
  });
});

有关详细说明，您可能需要查看JavaScript 中的闭包

于 2012-09-23T06:15:41.793 回答