将额外参数传递给jquery ajax promise回调[重复]

Posted 2023-03-07

【中文标题】将额外参数传递给jquery ajax promise回调[重复]

【英文标题】：Pass extra parameters to jquery ajax promise callback [duplicate]

【发布时间】：2014-03-25 23:08:53

【问题描述】：

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

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

标准的回调，应该是这样的：

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

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

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

我该怎么做？

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

【参考方案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 的第一个参数将在返回函数的主体内变为this。附加参数将预先添加到原始参数。

以下代码展示了如何使用绑定。对于 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>

【讨论】：

感谢您回答自己的问题！

太棒了！正是我想要的。我省略了b和c：var extraParam = "Casablanca";$.get( "./movies.xml" ).done(function(data) findMovie(data, extraParam); );function findMovie(data, extraParam) var year = $(data).find("MOVIE").has("NAME:contains('" + extraParam + "')").find("YEAR").text(); console.log(extraParam + " is a movie from " + year + ".")