JQuery passer plus de paramètres en rappel

Question

Est-il un moyen de passer plus de données dans une fonction de rappel en Jquery?

J'ai deux fonctions et je veux le rappel à l' $.post, par exemple, pour transmettre à la fois les données résultant de l'appel AJAX, ainsi que quelques-uns des arguments personnalisés

function clicked() {
    var myDiv = $("#my-div");
    // ERROR: Says data not defined
    $.post("someurl.php",someData,doSomething(data, myDiv),"json"); 
    // ERROR: Would pass in myDiv as curData (wrong)
    $.post("someurl.php",someData,doSomething(data, myDiv),"json"); 
}

function doSomething(curData, curDiv) {

}

Je veux être en mesure de passer dans mes propres paramètres à une fonction de rappel, ainsi que le résultat retourné à partir de l'appel AJAX.

Merci!

Answer 1

La solution est la liaison des variables par le biais de la fermeture.

Je n'ai pas utilisé l' .post en fonction jQuery, mais une analyse rapide de la documentation suggère le retour d'appel doit être un pointeur de fonction en acceptant les suivantes:

function callBack(data, textStatus, jqXHR) {};

Donc je pense que la solution est comme suit:

var doSomething = function(extraStuff) {
    return function(data, textStatus, jqXHR) {
        // do something with extraStuff
    };
};

var clicked = function() {
    var extraStuff = {
        myParam1: 'foo',
        myParam2: 'bar'
    }; // an object / whatever extra params you wish to pass.

    $.post("someurl.php", someData, doSomething(extraStuff), "json");
};

Ce qui se passe?

Dans la dernière ligne, doSomething(extraStuff) est invoquée et le résultat de l'invocation est un pointeur de fonction.

Parce qu' extraStuff est passé comme argument à l' doSomething il est dans la portée de l' doSomething fonction.

Lors de l' extraStuff est référencé dans le retour de l'anonyme en fonction interne de doSomething il est lié par fermeture à l'extérieur de la fonction de l' extraStuff argument. Cela est vrai même après l' doSomething est de retour.

Je n'ai pas testé la dessus, mais j'ai écrit, très semblable code dans les dernières 24 heures, et il fonctionne comme je l'ai décrit.

Vous pouvez bien entendu passer plusieurs variables au lieu d'un seul "extraStuff' objet en fonction de vos préférences personnelles/normes de codage.

Answer 2

Lors de l'utilisation d' doSomething(data, myDiv), vous avez fait appel de la fonction et de ne pas faire référence à elle.

Vous pouvez soit passer l' doStomething fonction directement, mais vous devez vous assurer qu'il a la bonne signature.

Si vous voulez garder doSomething la façon dont il est, vous pouvez faire appel à une fonction anonyme.

function clicked() {
    var myDiv = $("#my-div");
    $.post("someurl.php",someData, function(data){ 
      doSomething(data, myDiv)
    },"json"); 
}

function doSomething(curData, curDiv) {
    ...
}

À l'intérieur de la fonction anonyme code, vous pouvez utiliser les variables définies dans le cadre englobant. C'est le moyen le Javascript de délimitation de l'étendue des travaux.

Answer 3

Il est effectivement plus facile que de tout le monde on dirait... surtout si vous utilisez l' $.ajax({}) syntaxe de base contre l'une des fonctions d'assistance.

Il suffit de passer dans l' key: value paire comme vous le feriez sur n'importe quel objet, lorsque vous configurez votre requête ajax... (parce qu' $(this) n'a pas changé contexte pourtant, c'est encore l'élément déclencheur de l'appel de liaison ci-dessus)

<script type="text/javascript">
$(".qty input").bind("keypress change", function() {
    $.ajax({
        url: "/order_items/change/"+$(this).attr("data-order-item-id")+"/qty:"+$(this).val()+"/returnas.json",
        type: "POST",
        dataType: "json",
        qty_input: $(this),
        anything_else_i_want_to_pass_in: "foo",
        success: function(json_data, textStatus, jqXHR) {
            /* here is the input, which triggered this AJAX request */
            console.log(this.qty_input);
            /* here is any other parameter you set when initializing the ajax method */
            console.log(this.anything_else_i_want_to_pass_in);
        }
    });
});
</script>

L'une des raisons, c'est mieux que de fixer le var, c'est que le var est mondiale et en tant que tel, overwritable... si vous avez 2 choses qui peuvent déclencher des appels ajax, vous pourriez en théorie de déclenchement plus rapide que l'appel ajax répond, et vous auriez la valeur pour le deuxième appel est passé dans la première. En utilisant cette méthode, ci-dessus, cela ne se produira pas (et c'est assez simple à utiliser).

Answer 4

Aujourd'hui, dans le monde, il y a une autre réponse qui est plus propre, et, pris d'un autre Débordement de Pile réponse:

function clicked()
{
    var myDiv = $( "#my-div" );

    $.post( "someurl.php", {"someData": someData}, $.proxy(doSomething, myDiv), "json" );
}

function doSomething( data )
{
    // this will be equal to myDiv now. Thanks to jQuery.proxy().
    var $myDiv = this;

    // doing stuff.
    ...
}

Voici l'original de la question et la réponse: jQuery COMMENT?? passer des paramètres supplémentaires pour la réussite de rappel de $.appel ajax?

Answer 5

Vous pouvez également essayer quelque chose comme ce qui suit:

function clicked() {

    var myDiv = $("#my-div");

    $.post("someurl.php",someData,function(data){
        doSomething(data, myDiv);
    },"json"); 
}

function doSomething(curData, curDiv) {

}