将额外的参数传递给jquery ajax promise回调

小编典典

将额外的参数传递给jquery ajax promise回调

ajax

我需要将一个额外的参数传递.done给jquery ajax调用的promise回调：

$.post("MyUrl", JSON.stringify(data))
        .done(onMyUrlLoaded);

标准回调如下所示：

function onMyUrlLoaded(data, textStatus, jqXHR) { /* function code */ };

但是我需要将一个额外的参数传递给我的回调，如下所示：

function onMyUrlLoaded(data, textStatus, jqXHR, extraParam) { /* code */ };

我该怎么做？

注意：这个问题不是重复的，因为它是关于promise回调的。此外，这个问题比据说重复的问题大了两年，并且给出了更为彻底的答案，以及关于诺言的具体答案。

阅读 366

2020-07-26

共1个答案

小编典典

我发现包括一个新的间接级别真的很容易，就像这样：

var extraParam = 'xyz';

$.post("MyUrl", JSON.stringify(data))
        .done(function(a,b,c) { onMyUrlLoaded(a, b, c, extraParam); });

这样，除了三个标准参数外，回调还将接收extraParam。

当然，如果将promise存储在变量中（例如，由函数返回的变量），也可以执行以下操作：

function getUrl() {
  // some code ...
  var promise = $.post("MyUrl", JSON.stringify(data));
  return promise;
}

可以这样调用和使用：

var promise = getUrl();
var extraParam = 'xyz';
promise.done(function(a,b,c) { onMyUrlLoaded(a, b, c, extraParam); });

这样做的语法较短，其中包括使用bind。

调用bind函数时，会得到一个新函数。传递给bind的第一个参数将成为thisreturn函数的主体。其他参数将被前置到原来的参数。

以下代码显示了如何使用绑定。对于TL; DR，请看最后两个代码块

// To show the results in the page

var $log = $('#log');

var log = function(text) {

    $log.append(text+'<br/>');

};



// This returns a promise, and resolves it after the specified

// timeout. This behaves like a jQuery ajax call (but for the

// provided timeout)

var trigger = function(timeout) {

    log('<b>trigger</b> invoked');

    var deferred = $.Deferred();

    setTimeout(function() {

        log('<b>trigger</b> resolving promise');

        deferred.resolve('A','B');

    }, timeout);

    return deferred;

};



// This is the function we want to invoke

// The promise returns a and b - the extra params

// must be supplied in some way

var extraParams = function(extra1, extra2, a, b) {

    log('<b>extraParams</b> extra1:' + extra1);

    log('<b>extraParams</b> extra2:' + extra2);

    log('<b>extraParams</b> a:' + a);

    log('<b>extraParams</b> b:' + b);

};





// Doing it using indirection

trigger(500).then(function(a,b) {

  extraParams('extra1','extra2',a,b);

});



// Doing it using bind()

trigger(1200).then(

  extraParams.bind(this,'extra1','extra2')

);


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="log">

</div>

2020-07-26