jQuery / Ajax - $.ajax()传递参数给回调函数 - 是否有好的模式可用？

Question

我要开始使用的 JavaScript 代码：

function doSomething(url) {  
   $.ajax({
      type: "GET",  
      url: url,  
      dataType: "xml",  
      success: rssToTarget  
   });  
}    

我想要使用的模式：

//where elem is the target that should receive new items via DOM (appendChild)
function doSomething(url, elem) {
   $.ajax({
      type: "GET",
      url: url,
      dataType: "xml",
      success: rssToTarget(elem)
   });
}  

我认为这种方式无法使回调起作用，对吗？正确的模式是什么？我不想使用全局变量来临时保存elem或元素名称。

- BuddyJoe

---

如何在jQuery的AJAX调用中传递额外参数给成功回调函数？使用invokedata。 - Roman Rhrn Nesterov

供日后参考：您需要将回调函数（rssToTarget）存储在传递给 $.ajax() 的对象字面量的 success 属性中，这样 jQuery 才能在 AJAX 请求完成后调用该函数。通过在函数名的末尾添加 (elem)，您错误地调用了 rssToTarget 并将其返回值存储在 success 中。在 JS 中，在函数名的末尾添加括号会调用它。 - BrunoF

Answer 1

像这样...

function doSomething(url, elem) {
  $.ajax({
     type: "GET",
     url: url,
     dataType: "xml",
     success: function(xml) {
       rssToTarget(xml, elem);
     }
  });
}

回复您的评论：使用匿名函数会影响性能吗？

- Josh Stodola

---

在任何地方创建匿名函数会付出性能代价吗？ - BuddyJoe

我猜这真的会是……success: function(xml) { rssToTarget(xml, elem); } - BuddyJoe

如果在循环中包装$.ajax调用，这种方式将为每个循环创建新函数(function(xml){...})，消耗更多的内存。 - stack247

Answer 2

如果您在rssToTarget函数中创建一个closure，那么您想使用的模式可能会起作用：

function rssToTarget(element) {
  return function (xmlData) {
    // work with element and the data returned from the server
  }
}

function doSomething(url, elem) {
    $.ajax({ type: "GET",
         url: url,
         dataType: "xml",
         success: rssToTarget(elem)
       });
}

当执行rssToTarget(elem)时，元素参数被存储在闭包中，并返回回调函数，等待执行。

- Christian C. Salvadó

---

当然可以返回一个函数，试着运行一下这段代码吧！http://jsbin.com/anepo/edit - Christian C. Salvadó

返回的匿名函数带有一个输入参数... JavaScript 函数式编程能力使您可以通过函数实现更多功能... - Christian C. Salvadó

@RoyiNamir JavaScript 函数是可变参数的，它们可以被调用时传入比定义中所需参数更多（或更少！）。请放心，这个例子会按照预期工作。 - gcochard

这个答案比被采纳的答案更忠实地实现了提问者想要达到的目标。 - sage88

我喜欢这种方法，特别是如果我需要在循环中包装$.ajax调用，我不必为每个循环创建新函数。非常好的方法！ - stack247

Answer 3

关于利用Ajax请求设置上下文怎么样？

function doSomething(url, elem) {
   $.ajax({
      type: "GET",
      url: url,
      dataType: "xml",
      success: rssToTarget,
      elem: elem               // <- add as settings argument
   });
}

rssToTarget(ans) {
    elem = this.elem;          // <- get it back using "this"
}

默认情况下，回调上下文是$.ajaxSettings和传递给$.ajax的设置的合并。因此，如果您在$.ajax设置中添加字段，则它们将进入回调上下文。也就是说，您可以使用this从上下文中检索它们。

- Niki Romagnoli