2010-08-27 5 views
0

Ok, donc j'avoir un bout de code à partir d'un site Web contenant un bouton:Appel de fonctions multiples de onclick

<button type="button" 
      onclick="laser(); $.post('sheepDB.php', { vic: vic, num: numVics });"> 
    Activate Her Powers! 
    </button> 

Cependant, lorsque je clique sur le bouton la première fois, la première exécution de la fonction, mais si je cliquez dessus une seconde fois, à la fois la première fonction et l'appel Ajax sont exécutés. Comment puis-je obtenir onclick pour les exécuter séquentiellement? (laser() détermine les valeurs envoyées par la requête Ajax, elle doit donc être séquentielle).

Répondre

4

Javascript s'exécute séquentiellement. Cependant, AJAX est asynchrone (d'où le A), ce qui signifie que l'exécution de Javascript continue pendant que la demande AJAX est en cours. Si vous déclenchez votre onclick une deuxième fois avant la fin de la première requête AJAX, il est possible que la première requête AJAX ne se termine pas avant le second clic (et semble ainsi ne se produire qu'une seule fois).

1

Eh bien d'abord tout ce que je ne dirais pas le code directement dans onClick simplement joindre le gestionnaire $(selector).click(). quel que soit votre code ne fera pas ce que vous essayez de faire ... vous avez besoin quelque chose comme ce que votre gestionnaire:

$(selectorForButton).click(
    function(e){ 
    e.preventDefault(); // dont fire the normal event 

    /* youll probably have to rework laser if it depends on `this` referring to the dom element  
    * clicked in this example lets say it returns a hash of vic and num vics... 
    */ 
    var _this = $(this); 
    var data = laser(this); 
    // check if this is already sending a post request 
    if(!_this.data('activated')){ 
    $.post('sheepDB.php', data, function(){ 
     // this is important - we need to set it to false so we now on the next click that 
     // post innt in the process of doing its thing 
     _this.data('activated', false); 
    }); 
    } 

    return false; 
}); 
0
$(document).ready(function() { 
    $('#yourButtonId').click(function() { 
     // collect your values into a json object 
     var someData = { 
     x: '', 
     y: '', 
     z: '' 
     }; 

     //execute post 
     $.post('someUrl', someData, function(data, textStatus) { 
     // callback 
     }); 
    }) 
}) 
Questions connexes