Chrome uniquement: ajax gèle mon exécution javascript

Question

Ajax signifie asynchrone, mais il semble que ce soit l'arrêt de mon exécution javascript ou au moins une pause et la reprise de la réponse.

valeur HTML

<input value="foo" data-loading-text="bar" class="foo"> 

Extension jquery ->

$.fn.bootstrapButton= function(type){ 
    $el = $(this); 
    loadingText = $el.attr("data-loading-text"); 
    currentValue = $el.val(); 
    if(type === "loading") 
     $el.attr("data-loading-text",currentValue) 
     .val(loadingText) 
     .prop("disabled", true) 
    else if(type === "reset") 
     $el.val(loadingText) 
     .prop("disabled", false) 
     .attr("data-loading-text", currentValue) 
} 

Fonction appel ->

save= function (name){ 
    $save = $(".ok") 
    $save.bootstrapButton("loading") 
    $.ajax({ 
    type: 'POST' 
    url: '/server' 
    cache: false 
    dataType: 'json' 
    data:"ss" 
    success: function(response){ 
     alert("success") 
    }).always(function(){ 
    $save.bootstrapButton("reset") 
    }) 
} 

J'extension bouton d'amorçage de coz du problème de bouton de l'interface utilisateur jquery. Mais - quand cela est en cours d'exécution, je ne vois jamais le texte de chargement jusqu'à ce que la requête ajax est terminée !! da faq !. Asynchrone n'est pas vrai asynchrone?

BTW, le code fonctionne sans aucun pépin (je peux voir le texte de chargement) avec cette petite modification.

save= function (name){ 
    $save = $(".ok") 
    $save.bootstrapButton("loading") 
    setTimeout(funtion(){ 
    $.ajax({ 
     type: 'POST' 
     url: '/server' 
     cache: false 
     dataType: 'json' 
     data:"ss" 
     success: function(response){ 
     alert("success") 
     }).always(function(){ 
     $save.bootstrapButton("reset") 
    }) 
    },100) 
} 

Par exemple, avec un retard de 100 millisec, le texte de chargement apparaît!

Answer 1

Ajout du dessous comme une option dans ma requête ajax résolu le problème.

async: true

Answer 2

La construction:

$.ajax({ 
.... 
}).always(function(){ 
    $save.bootstrapButton("reset") 
    }) 

dit: « Exécuter cette commande Ajax, et quand il se fait toujours exécuter cette fonction anonyme

Vous avez dit explicitement,. » Attendre jusqu'à ce que l'appel Ajax est fait », et cela fonctionne.