javascript - jQuery将更多参数传递给回调

Question

有没有办法在 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 调用返回的结果传递给回调。

Answer 1

解决办法是通过闭包来绑定(bind)变量。

---

作为一个更基本的例子，这里有一个接收和调用回调函数的示例函数，以及一个示例回调函数:

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 Arrow Functions :

callbackReceiver(value => callback(value, "Foo Bar")); // "Hello World", "Foo Bar"

---

至于您的具体示例，我没有在 jQuery 中使用 .post 函数，但快速浏览文档表明回调应该是 函数指针 带有以下签名:

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) 是 invoked 并且该调用的结果是一个 function pointer。

因为 extraStuff 作为参数传递给 doSomething 它在 doSomething 函数的范围内。

当 extraStuff 在返回的 doSomething 的匿名内部函数中被引用时，它通过闭包绑定(bind)到外部函数的 extraStuff 参数。即使在 doSomething 返回之后也是如此。

我还没有测试过上述内容，但我在过去 24 小时内编写了非常相似的代码，并且它的工作原理与我所描述的一样。

您当然可以传递多个变量而不是单个“extraStuff”对象，具体取决于您的个人偏好/编码标准。