Jak dzwonić.ajaxStart () na konkretnych wywołaniach ajax

Jeśli umieścisz to w swojej funkcji, która obsługuje akcję ajax, będzie ona wiązać się tylko wtedy, gdy jest to właściwe:

$('#yourDiv')
    .ajaxStart(function(){
        $("ResultsDiv").hide();
        $(this).show();
    })
    .ajaxStop(function(){
        $(this).hide();
        $(this).unbind("ajaxStart");
    });

W obiekcie options znajduje się atrybut .ajax() przyjmuje wywołanie global .

Jeśli ustawione na false , nie wywoła zdarzenia ajaxStart dla wywołania.

    $.ajax({
        url: "google.com",
        type: "GET",
        dataType: "json",
        cache: false,
        global: false, 
        success: function (data) {

Ponadto, jeśli chcesz wyłączyć wywołania .ajaxStart() i .ajaxStop(), możesz ustawić opcję global na false w zapytaniach .ajax();)

Zobacz więcej tutaj: jak dzwonić .ajaxStart() na konkretnych wywołaniach ajax

Użyj lokalnych zdarzeń Ajax

                success: function (jQxhr, errorCode, errorThrown) {
                    alert("Error : " + errorThrown);
                },
                beforeSend: function () {
                    $("#loading-image").show();
                },
                complete: function () {
                    $("#loading-image").hide();
                }

Niestety, ajaxStart event nie posiada żadnych dodatkowych informacji, których możesz użyć, aby zdecydować, czy chcesz pokazać animację, czy nie.

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

Użyj funkcji beforeSend lub complete callback w wywołaniu ajax w ten sposób..... Przykład na żywo jest tutaj https://stackoverflow.com/a/34940340/5361795

Source ShoutingCode

Mam rozwiązanie. Ustawiłem globalną zmienną js o nazwie showloader (domyślnie ustawioną jako false). W każdej z funkcji, które chcesz pokazać loader wystarczy ustawić go na true przed wykonaniem połączenia ajax.

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

Wtedy mam następujące w sekcji głowy;

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

$(document).ajaxComplete(function() 
{
    $('.loadingholder').fadeOut(200);
    showloader=false;
});

Użyj ajaxSend i ajaxComplete, jeśli chcesz interspektować żądanie przed podjęciem decyzji, co zrobić. Zobacz moją odpowiedź tutaj: https://stackoverflow.com/a/15763341/117268

<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.");
});