Comment appeler.ajaxStart () sur des appels ajax spécifiques

j'ai quelques appels ajax sur le document d'un site qui affiche ou Cache une barre de progression en fonction du statut ajax 

  $(document).ajaxStart(function(){ 
        $('#ajaxProgress').show(); 
    });
  $(document).ajaxStop(function(){ 
        $('#ajaxProgress').hide(); 
    });

je voudrais fondamentalement overwirte ces méthodes sur d'autres parties du site où beaucoup de petits appels ajax rapides sont faits et n'ont pas besoin de la barre de progrès popping in et out. J'essaie de les attacher ou de les insérer dans d'autres $.getJSON et $.les appels ajax. J'ai essayé de chaînage, mais apparemment ce n'est pas bon. 

$.getJSON().ajaxStart(function(){ 'kill preloader'});
42
demandé sur kevzettler 2009-07-28 05:23:48

10 réponses

2018 REMARQUE: Cette réponse est obsolète; n'hésitez pas à proposer une modification de cette réponse qui va travailler.

vous pouvez lier ajaxStart et ajaxStop en utilisant l'espace de noms personnalisé: 

$(document).bind("ajaxStart.mine", function() {
    $('#ajaxProgress').show();
});

$(document).bind("ajaxStop.mine", function() {
    $('#ajaxProgress').hide();
});

Puis, dans d'autres parties du site, vous serez temporairement déliaison avant votre .json appelle: 

$(document).unbind(".mine");

a Eu l'idée de ici lors de la recherche pour une réponse.

EDIT: Je n'ai pas eu le temps de le tester, hélas.

34
répondu montrealist 2018-10-05 15:13:14

si vous mettez ceci dans votre fonction qui gère une action ajax, il ne se liera que si nécessaire: 

$('#yourDiv')
    .ajaxStart(function(){
        $("ResultsDiv").hide();
        $(this).show();
    })
    .ajaxStop(function(){
        $(this).hide();
        $(this).unbind("ajaxStart");
    });
15
répondu Jason Rikard 2013-05-16 02:36:47

il y a un attribut dans l'objet options .ajax() prend appelé global .

Si false , il ne sera pas déclencher le ajaxStart événement de l'appel. 

    $.ajax({
        url: "google.com",
        type: "GET",
        dataType: "json",
        cache: false,
        global: false, 
        success: function (data) {
12
répondu Hasnat Safder 2018-07-10 09:24:00

en outre, si vous voulez désactiver appels à .ajaxStart() et .ajaxStop() , vous pouvez définir global option à false dans vos .ajax() requêtes ;)

voir plus ici: comment téléphoner .ajaxStart () sur des appels spécifiques ajax

7
répondu GxiGloN 2017-05-23 12:02:34

utiliser des événements Ajax à portée locale 

                success: function (jQxhr, errorCode, errorThrown) {
                    alert("Error : " + errorThrown);
                },
                beforeSend: function () {
                    $("#loading-image").show();
                },
                complete: function () {
                    $("#loading-image").hide();
                }
5
répondu Ramya Muthukumar 2017-02-09 01:32:06

malheureusement, l'événement ajaxStart n'a pas d'informations supplémentaires que vous pouvez utiliser pour décider de montrer l'animation ou non.

en tout cas, j'ai une idée. Dans votre méthode ajaxStart, pourquoi ne pas démarrer l'animation après 200 millisecondes? Si les requêtes ajax sont complètes en 200 millisecondes, vous ne montrez aucune animation, sinon vous montrez l'animation. Le Code peut ressembler à quelque chose comme: 

var animationController = function animationController()
{
    var timeout = null;
    var delayBy = 200; //Number of milliseconds to wait before ajax animation starts.

    var pub = {};

    var actualAnimationStart = function actualAnimationStart()
    {
        $('#ajaxProgress').show();
    };

    var actualAnimationStop = function actualAnimationStop()
    {
        $('#ajaxProgress').hide();
    };

    pub.startAnimation = function animationController$startAnimation() 
    { 
        timeout = setTimeout(actualAnimationStart, delayBy);
    };

    pub.stopAnimation = function animationController$stopAnimation()
    {
        //If ajax call finishes before the timeout occurs, we wouldn't have 
        //shown any animation.
        clearTimeout(timeout);
        actualAnimationStop();
    }

    return pub;
}();


$(document).ready(
    function()
    {
        $(document).ajaxStart(animationController.startAnimation);
        $(document).ajaxStop(animationController.stopAnimation);
    }
 );
3
répondu SolutionYogi 2009-07-28 01:46:12

utilisez les fonctions beforeSend ou complete callback dans les appels ajax comme ceci..... L'exemple en direct est ici https://stackoverflow.com/a/34940340/5361795

Source ShoutingCode

2
répondu Zigri2612 2017-05-23 11:54:07

j'ai une solution. J'ai défini une variable js globale appelée showloader (définie comme false par défaut). Dans n'importe laquelle des fonctions que vous voulez montrer le chargeur vient de le régler à true avant de faire l'appel ajax. 

function doAjaxThing()
{
    showloader=true;
    $.ajax({yaddayadda});
}

alors j'ai ce qui suit dans ma section de tête; 

$(document).ajaxStart(function()
{
    if (showloader)
    {
        $('.loadingholder').fadeIn(200);
    }
});    

$(document).ajaxComplete(function() 
{
    $('.loadingholder').fadeOut(200);
    showloader=false;
});
1
répondu Ollie Brooke 2014-03-21 04:14:25

utilisez ajaxSend et ajaxComplete si vous voulez interspecter la requête avant de décider quoi faire. Voir ma réponse ici: https://stackoverflow.com/a/15763341/117268

0
répondu Emil Stenström 2017-05-23 11:46:34 
<div class="Local">Trigger</div>

<div class="result"></div>
<div class="log"></div>

$(document).ajaxStart(function() {
$( "log" )text( "Trigger Fire successfully." );
});

$( ".local" ).click(function() {
$( ".result" ).load("c:/refresh.html.");
});

il suffit de passer par cet exemple vous obtenez une idée.Lorsque l'utilisateur clique sur l'élément avec class Local et que la requête Ajax est envoyée, le message de log s'affiche.

0
répondu Praveen04 2013-07-11 11:58:04