如何编写一个接受回调作为参数的 jquery 函数答案

【问题标题】：How do I write a jquery function that accepts a callback as a parameter如何编写一个接受回调作为参数的 jquery 函数
【发布时间】：2010-11-05 02:59:05
【问题描述】：

我有以下功能。

function ChangeDasPanel(controllerPath, postParams) {

    $.post(controllerPath, postParams, function(returnValue) {

        $('#DasSpace').hide("slide", { direction: "right" }, 1000, function() {

            $('#DasSpace').contents().remove();

            $('#DasSpace').append(returnValue).css("display", "block");

            $('#DasSpace').show("slide", { direction: "right" }, 1000);

        });

    });

};

但我希望能够这样称呼它

ChangeDasPanel("../Home/Test", {} ,function (){
  //do some stuff on callback
}

如何在我的函数中实现对回调的支持？

【问题讨论】：

标签： javascript jquery function callback

【解决方案1】：

function ChangeDasPanel(controllerPath, postParams, f) {
  $.get(
    controllerPath, 
    postParams, 
    function(returnValue) {
      var $DasSpace = $('#DasSpace');
      $DasSpace.hide(
        "slide", { direction: "right" }, 1000, 
        function() {
          $DasSpace.contents().remove();
          $DasSpace.append(returnValue).css("display", "block");
          $DasSpace.show("slide", { direction: "right" }, 1000);
        }
      );
      if (typeof f == "function") f(); else alert('meh');
    }
  );
};

您可以像 JavaScript 中的任何其他对象一样传递函数。传入回调函数很简单，您甚至可以在 $.post() 调用中自己完成。

您可以决定是将回调作为$.post() 回调的一部分调用还是单独调用。

【讨论】：

这正是我过去 30 分钟一直在尝试做的事情。谢谢！帮了我
感谢“if (typeof f == "function") f();”部分。我一直在找那个！

【解决方案2】：

如果我理解正确的话，就像设置另一个参数并将变量作为函数调用一样简单：

function foo(mycallback) {
    mycallback();
}

【讨论】：

【解决方案3】：

为什么不使用可以传递给函数的对象。它更像 jQuery，它为您节省了 x 个难以维护的命名参数，因为当您超过 3 个参数时它会变得笨拙。

例如

function callingFunction(){

      var fnSettings: {
        url: someUrl,
        data: params,
        callback : function(){}
      };


      yourFunction( fnSettings );

}

function yourFunction( settings ) {

      $.post( settings.url, settings.data, settings.callback );

}

【讨论】：

这绝对是最干净的答案（我写了类似的东西，所以我可能有偏见）

【解决方案4】：

你知道全局变量和函数是邪恶的，所以为什么不把你的放到 jQuery 命名空间中：

$.extend({
  myFunc : function(someArg, callbackFnk){
    var url = "http://example.com?q=" + someArg;
    $.getJSON(url, function(data){

      // now we are calling our own callback function
      if(typeof callbackFnk == 'function'){
        callbackFnk.call(this, data);
      }

    });
  }
});

$.myFunc(args, function(){
  // now my function is not hardcoded
  // in the plugin itself
});

阅读这篇文章以获得更好的理解：Creating callback functions in jQuery

【讨论】：

酷。我怎样才能像在 Jquery 本身 $.hide(555, function()){}) 中一样创建匿名函数？还是 callbackFnk 是答案？
是的，callbackFnk 只是一个局部变量。正如您在示例中看到的，我们传递了一个匿名函数：$.myFunc(args, function(){})。
再次感谢！还有一个问题，主函数完成后会触发吗？
不，它将在主函数中触发（在myFunc 调用中）。