有没有办法将更多数据传递给 jQuery 中的回调函数？
我有两个函数，我希望回调到$.post，例如，传入 AJAX 调用的结果数据以及一些自定义参数
function clicked() {
var myDiv = $("#my-div");
// ERROR: Says data not defined
$.post("someurl.php",someData,doSomething(data, myDiv),"json");
// ERROR: Would pass in myDiv as curData (wrong)
$.post("someurl.php",someData,doSomething(data, myDiv),"json");
}
function doSomething(curData, curDiv) {
}
我希望能够将我自己的参数传递给回调，以及从 AJAX 调用返回的结果。
解决方案是通过闭包绑定变量。
作为一个更基本的例子，这里有一个接收和调用回调函数的示例函数，以及一个示例回调函数：
function callbackReceiver(callback) {
callback("Hello World");
}
function callback(value1, value2) {
console.log(value1, value2);
}
这将调用回调并提供一个参数。现在你想提供一个额外的参数，所以你将回调包装在闭包中。
callbackReceiver(callback); // "Hello World", undefined
callbackReceiver(function(value) {
callback(value, "Foo Bar"); // "Hello World", "Foo Bar"
});
或者，更简单地使用ES6 箭头函数：
callbackReceiver(value => callback(value, "Foo Bar")); // "Hello World", "Foo Bar"
至于你的具体例子，我没有.post在 jQuery 中使用过这个函数，但是快速浏览一下文档表明回调应该是一个具有以下签名的函数指针：
function callBack(data, textStatus, jqXHR) {};
因此我认为解决方法如下：
var doSomething = function(extraStuff) {
return function(data, textStatus, jqXHR) {
// do something with extraStuff
};
};
var clicked = function() {
var extraStuff = {
myParam1: 'foo',
myParam2: 'bar'
}; // an object / whatever extra params you wish to pass.
$.post("someurl.php", someData, doSomething(extraStuff), "json");
};
怎么了？
在最后一行中，doSomething(extraStuff)被调用并且该调用的结果是一个函数指针。
因为extraStuff作为参数传递给doSomething它是在doSomething函数的范围内。
当extraStuff在返回的匿名内部函数中引用时，doSomething它通过闭包绑定到外部函数的extraStuff参数。即使在doSomething返回之后也是如此。
我还没有测试过上述内容，但我在过去 24 小时内编写了非常相似的代码，它的工作原理与我描述的一样。
您当然可以根据您的个人喜好/编码标准传递多个变量而不是单个“extraStuff”对象。
使用时doSomething(data, myDiv)，您实际上是在调用该函数，而不是对其进行引用。
您可以doStomething直接传递函数，但必须确保它具有正确的签名。
如果你想保持 doSomething 的原样，你可以将它的调用包装在一个匿名函数中。
function clicked() {
var myDiv = $("#my-div");
$.post("someurl.php",someData, function(data){
doSomething(data, myDiv)
},"json");
}
function doSomething(curData, curDiv) {
...
}
在匿名函数代码中，您可以使用在封闭作用域中定义的变量。这就是 Javascript 作用域的工作方式。
它实际上比每个人都说得更容易……特别是如果您使用$.ajax({})基本语法与辅助函数之一。
key: value当您设置 ajax 请求时，只需像在任何对象上一样传递对... （因为$(this)尚未更改上下文，它仍然是上述绑定调用的触发器）
<script type="text/javascript">
$(".qty input").bind("keypress change", function() {
$.ajax({
url: "/order_items/change/"+$(this).attr("data-order-item-id")+"/qty:"+$(this).val()+"/returnas.json",
type: "POST",
dataType: "json",
qty_input: $(this),
anything_else_i_want_to_pass_in: "foo",
success: function(json_data, textStatus, jqXHR) {
/* here is the input, which triggered this AJAX request */
console.log(this.qty_input);
/* here is any other parameter you set when initializing the ajax method */
console.log(this.anything_else_i_want_to_pass_in);
}
});
});
</script>
这比设置 var 更好的原因之一是 var 是全局的，因此，可以覆盖......如果你有两件事可以触发 ajax 调用，理论上你可以比 ajax 调用响应更快地触发它们，并且您将第二个调用的值传递给第一个调用。使用上面的这种方法，就不会发生这种情况（而且使用起来也很简单）。
在当今世界，还有一个更简洁的答案，取自另一个 Stack Overflow 的答案：
function clicked()
{
var myDiv = $( "#my-div" );
$.post( "someurl.php", {"someData": someData}, $.proxy(doSomething, myDiv), "json" );
}
function doSomething( data )
{
// this will be equal to myDiv now. Thanks to jQuery.proxy().
var $myDiv = this;
// doing stuff.
...
}
这是原始问题和答案： jQuery HOW TO?? 将附加参数传递给 $.ajax 调用的成功回调？
您还可以尝试以下操作：
function clicked() {
var myDiv = $("#my-div");
$.post("someurl.php",someData,function(data){
doSomething(data, myDiv);
},"json");
}
function doSomething(curData, curDiv) {
}