传递额外的参数给jQuery的阿贾克斯承诺回调 [英] Pass extra parameters to jquery ajax promise callback

问题描述

我需要传递一个额外的参数给 .done 承诺一个jquery Ajax调用回调函数：

  $。员额（MyUrl，JSON.stringify（数据））
        .done（onMyUrlLoaded）;
 

标准的回调，会是这样的：

 函数onMyUrlLoaded（数据，textStatus，jqXHR）{/ *函数code * /};
 

但我需要一个额外的参数传递给我的回调，像这样的：

 函数onMyUrlLoaded（数据，textStatus，jqXHR，extraParam）{/ * code * /};
 

我该怎么办呢？

解决方案

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

  VAR extraParam ='某某';

$。员额（MyUrl，JSON.stringify（数据））
        .done（功能（A，B，C）{onMyUrlLoaded（A，B，C，extraParam）;}）;
 

在这种方式中，回调将收到extraParam，除了三个标准参数

当然，这也可以做，如果承诺被存储在一个变量，例如，一个通过函数返回，就像这样：

 函数的getURL（）{
  //一些code ...
  VAR承诺= $。员额（MyUrl，JSON.stringify（数据））;
  返回的承诺;
}
 

这可以被调用和使用这样的：

  VAR承诺=的getURL（）;
VAR extraParam ='某某';
promise.done（功能（A，B，C）{onMyUrlLoaded（A，B，C，extraParam）;}）;
 

有这样做，其由在使用较短的语法<一href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind"相对=nofollow>绑定。

当你调用绑定的功能，你会得到一个新的功能。通过绑定的第一个参数将成为这德返回功能的体内。其他参数将是 prepended 以原来的参数。

下面code展示了如何使用绑定。对于TL; DR期待的code中的最后两个块

//要显示的结果页面 变量$日志= $（'＃日志）; VAR数=功能（文字）{     $ log.append（文本+'＆LT; BR /＆GT;'）; }; //这会返回一个承诺，并在指定后解决它 // 时间到。这就像一个jQuery的AJAX调用（但在 //提供超时） VAR触发=功能（超时）{     登录（'＆LT; B＆GT;触发＆LT; / B＆GT;调用'）;     VAR推迟= $ .Deferred（）;     的setTimeout（函数（）{         登录（'＆LT; B＆GT;触发＆LT; / B＆GT;解决承诺'）;         deferred.resolve（'A'，'B'）;     }， 时间到）;     返回延迟; }; //这是我们想要调用的函数 //该承诺返回a和b - 额外的PARAMS //必须以某种方式提供 VAR extraParams =功能（extra1，extra2，A，B）{     登录（'＆LT; B＆GT; extraParams＆LT; / B＆GT; extra1：'+ extra1）;     登录（'＆LT; B＆GT; extraParams＆LT; / B＆GT; extra2：'+ extra2）;     登录（'＆LT; B＆GT; extraParams＆LT; / B＆gt;一种：'+一）;     登录（'＆LT; B＆GT; extraParams＆LT; / B＆GT; B：'+ B）; }; //做它用间接 触发器（500）。然后（功能（A，B）{   extraParams（'extra1'，'extra2'，A，B）; }）; 使用绑定//做这件事（） 触发（1200）。然后（   extraParams.bind（此，'extra1'，'extra2'） ）;

＆LT;脚本SRC =htt​​ps://ajax.googleapis.com/ajax /libs/jquery/2.1.1/jquery.min.js"></script> ＆LT; D​​IV ID =登录＆GT; ＆LT; / DIV＆GT;

I need to pass an extra parameter to the .done promise callback of a jquery ajax call:

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

The standard callback, would be like this:

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

But I need to pass an extra parameter to my callback, like this:

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

How can I do it?

解决方案

I've discovered that it's really easy including a new indirection level, just like this:

var extraParam = 'xyz';

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

In this way, the callback will receive the extraParam, besides the three standard parameters.

Of course, this can also be done if the promise is stored in a variable, for example one returned by a function, like this:

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

This can be invoked and used like this:

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

There is a shorter syntax for doing this, which consist in using bind.

When you call bind in a function, you get a new function. The first parameter passed to bind will become this inside the body of teh return function. The additional parameters will be prepended to the original arguments.

The following code shows how to use bind. For TL;DR look the two last blocks of code

// 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>

这篇关于传递额外的参数给jQuery的阿贾克斯承诺回调的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！