保留 JQuery ajax 函数的上下文答案

【问题标题】：Retain the context of JQuery ajax function保留 JQuery ajax 函数的上下文
【发布时间】：2012-09-18 14:42:40
【问题描述】：

我有一个旧代码，它依赖于使用以下 ajax 调用的 JQuery 1.3.2

function ChangeContent(url, somepageobject) {
   var xhrobj = $.ajax({
       url: url,
       context: somepageobject,
       callback: doFurtherStuff,
       success: function(data) {
                somepageobject.html($(data));
                this.callback.call(this.context[0], data, "ok"); // >> Code breaks here
           }
  });
  return xhrobj;
 }

上面代码的问题是，当我升级到 JQuery 1.8.1 时 this.callback 为空，最重要的是 ChangeContent 函数在不同的地方使用并且不在我的控制范围内（它用作外部用户的 API ...ETC）。上面的用法示例如下：

xhr_object = ChangeContent("/someurl, $("#resultContainer"));

function doFurtherStuff(responseText, statusText, XMLHttpRequest) 
{
   var identifier = '#' + this.id;
   ...
}

请注意，doFurtherStuff 必须具有正确的“this”对象值，即 ChangeContent 函数中指定的上下文。当我尝试使用不同的延迟 then() ...等。 JQuery 1.8.1 中用于解决上述this.callback.call(this.context[0], data); 问题的函数在升级后回调函数中的“this”对象具有不同的值，因为我猜新的 JQuery 库处理方式不同。

是否有办法修复上述错误，同时限制对 ChangeContent 函数的更改，因为我尽量避免要求所有用户更改他们调用和处理来自该函数的回调的方式？

【问题讨论】：

在 1.8 中（甚至在 1.4 中），context 是 this 在 success 中所指的内容。我猜doFurtherStuff.call(this, data, "ok") 应该可以工作。
谢谢@pimvdb，您的评论也很好，我只需要将下面的答案标记为一个，因为它更全面。

标签： ajax jquery xmlhttprequest closures

【解决方案1】：

当你添加 context 选项时，你告诉 jQuery this 应该在成功回调中。这意味着您无法访问传递给 ajax 请求的选项。要么不提供context，要么手动传入回调。

function ChangeContent(url, somepageobject) {
   var callback = doFurtherStuff;
   var xhrobj = $.ajax({
       url: url,
       context: somepageobject,
       success: function(data) {
                somepageobject.html($(data));
                callback.call(this[0], data, "ok"); // >> Code breaks here
           }
  });
  return xhrobj;
}

更新：如果您想继续按原样使用您的代码，只需重命名上下文属性即可。

function ChangeContent(url, somepageobject) {
   var xhrobj = $.ajax({
       url: url,
       thecontext: somepageobject,
       callback: doFurtherStuff,
       success: function(data) {
                somepageobject.html($(data));
                this.callback.call(this.thecontext[0], data, "ok"); // >> Code breaks here
           }
  });
  return xhrobj;
}

【讨论】：