jQuery 将更多参数传递到回调中

javascript function jquery arguments callback

2022-08-30 00:27:27

有没有办法在jQuery中将更多数据传递到回调函数中？

我有两个函数，我希望对的回调，例如，传入AJAX调用的结果数据以及一些自定义参数$.post

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调用返回的结果。

答案 1

解决方案是通过闭包绑定变量。

作为更基本的示例，下面是一个接收和调用回调函数的示例函数，以及一个示例回调函数：

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"

至于你的具体例子，我没有在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)

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

当在返回的匿名内部函数中被引用时，它被闭包绑定到外部函数的参数。即使已经返回，也是如此。extraStuffdoSomethingextraStuffdoSomething

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

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

答案 2

使用时，您实际上调用了该函数，并且不对其进行引用。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范围界定的工作方式。