如何将值传递给jQuery Ajax成功处理程序

Question

在jQuery中给出以下Ajax调用：

  {
  .
  .
  .
  ,
  getSomeData: function(args, myUrl, foo) {
        $.ajax( {
        type: "GET",
        url:  myUrl,
        data: args,
        async: true,
        dataType: 'json',
        success: myHandler  

         });
 },

   myHandler: function (data, textStatus, oHTTP, foo){   ...   }  

};

可以将值foo以某种方式附加到传递给success-handler myHandler的参数中吗？ 是否有任何方法可以将值传递给GET上的服务器，并使该值在往返中返回到客户端，重新出现在success-handler的参数列表中？ 我无法更改data返回的结构。

Answer 1

如果在请求中声明myHandler ，则可以使用闭包 。

getSomeData: function(args, myUrl, foo) {
        $.ajax( {
        type: "GET",
        url:  myUrl,
        data: args,
        async: true,
        dataType: 'json',
        success: function (data, textStatus, oHTTP){   ...   }  

         });
 },

这样， foo将在success回调中为您提供。

Answer 2

如果你是$ .ajax调用是在一个类中，成功回调是传递给该类的方法，它不起作用。

编辑：这是答案。 请注意，我将函数ajaxCall定义为类中的方法。 我将this.before，this.error和this.success定义为ajaxCall的方法，因为它们可以从superClass调用方法。

function main(url){
  this.url = url;

  this.ajaxCall = function(){

          this.before = function(){
                  //Can call main class methods
                  };
          this.error = function(){
                         //Can call main class methods
                       };
          this.success = function(data){
                           //Can call main class methods
                         };

          //This is how you pass class arguments into the success callback
          var that = this;

          $.ajax({ 
            url: this.url,
            type: 'GET',
            dataType: 'json',
            beforeSend: this.before(),
                error: this.error(),
            success: function(data){that.succes(data);}
          });

  //Run internally by calling this.ajaxCall() after it is defined
  //this.ajaxCall();
}

//Or externally
var main = new main(SOME_URL);
main.ajaxCall();

Answer 3

@Unicron有正确的答案，但没有给出一个很好的例子。 看一下这个：

$( 'tr.onCall' ).on( 'click', function( event ) {
    let pEvent = function() { return event; } // like a fly in amber...
    $.ajax( {
        ...
        success: function( data ) {
            let x = pEvent();   // x now equals the event object of the on("click")
        }
    });
});

通过在触发的匿名函数on("click")声明pEvent函数，事件对象在其原始上下文中“冻结”（封装）。 即使您在ajax成功函数的不同上下文中调用它，它也会保留其原始上下文。

更具体的例子：我打算在点击时打开一个模态对话框（样式为Div），但是当对话框关闭时，我想将焦点返回到被点击的元素，首先打开它...

$( 'tr.onCall' ).on( 'click', function( event ) {
    let rTarget = function() { return event.currentTarget; }
    $.ajax( {
        url: 'ajax_data.php',
        ...other settings...
        success: function( data ) {
            modal_dialog(
                data,
                {
                    returnTarget: rTarget(),
                    ...other settings...
                }
            );
        }
    });
});

成功时，它调用自定义函数modal_dialog() （在别处定义），传入包含各种设置的对象。 returnTarget设置包含单击的元素的HTML ID属性; 所以当我关闭对话框时，我可以运行$(options.returnTarget).focus(); 将焦点返回到该元素。