2009-06-23 7 views
48

I J'ai la fonction suivante.Comment écrire une fonction jquery qui accepte un callback en tant que paramètre

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); 

     }); 

    }); 

}; 

Mais je veux pouvoir l'appeler comme ça

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

Comment puis-je mettre en œuvre un soutien pour callbacks dans ma fonction?

Répondre

75
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'); 
    } 
); 
}; 

Vous pouvez transmettre des fonctions comme n'importe quel autre objet en JavaScript. Passer une fonction de rappel est simple, vous pouvez même le faire vous-même dans l'appel $.post().

Vous pouvez décider si vous souhaitez que votre rappel soit appelé dans le cadre du rappel $.post() ou seul.

+0

exactement ce que j'ai essayé de faire au cours des 30 dernières minutes. Merci! m'a aidé –

+0

Merci pour le "if (typeof f ==" function ") f();" partie. J'ai cherché ça! – Garavani

14

Si je vous comprends bien, il est aussi facile que la définition d'un autre paramètre et appeler la variable en fonction:

function foo(mycallback) { 
    mycallback(); 
} 
11

Pourquoi utilisez-vous pas un objet que vous pouvez passer à travers la fonction. Il est beaucoup plus jQuery et il vous évite d'avoir x paramètres nommés qui est difficile à maintenir car il peut devenir difficile quand vous avez passé 3 params.

par exemple

function callingFunction(){ 

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


     yourFunction(fnSettings); 

} 

function yourFunction(settings) { 

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

} 
+0

Ceci est certainement la réponse la plus propre (j'ai écrit quelque chose de similaire, donc je pourrais être partial) – arviman

22

Vous savez que les variables et les fonctions globales sont mauvaises, alors pourquoi ne pas mettre la vôtre dans l'espace de noms 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 
}); 

Lire la suite pour obtenir une meilleure compréhension: Creating callback functions in jQuery

+0

Cool. Comment puis-je créer une fonction anonyme comme dans Jquery lui-même '$ .hide (555, function()) {})' ?? Ou callbackFnk est la réponse? – aleXela

+0

Yeap, 'callbackFnk' est juste une variable locale. Comme vous pouvez le voir dans l'exemple, nous passons une fonction anonyme: '$ .myFunc (args, function() {})'. – Uzbekjon

+0

Merci encore une fois! Une question de plus, va-t-elle se déclencher après la fin de la fonction principale? – aleXela

Questions connexes