Deaktivieren Sie ajaxStart () und ajaxStop () für eine bestimmte Anforderung

Ich verwende .ajaxStart () und .ajaxStop (), um ein Modal anzuzeigen, während eine Ajax-Anfrage gestellt wird. (zwischen Start und Stopp)

Jetzt möchte ich eine Longpoll-Funktion hinzufügen, die auf Benachrichtigungen wartet, ähnlich der in der linken oberen Ecke dieser Site.

Mein Problem liegt nun darin, dieses Modal nur für die Longpolling-Anfrage zu deaktivieren.

Ein- und Ausschalten von "Ladebildschirm" -Handlern:

$(document).ajaxStart(handleAjaxStart);
$(document).ajaxStop(handleAjaxStop);

Meine Longpoll-Funktion:

$.ajax({
    timeout: 35000,
    url: longPollUrl,
    success: function(data){
        if(data.queCount) $('#numQueCount').html(data.queCount);
        if(data.queAccept) $('#numQueAccept').html(data.queAccept);
    }, 
    dataType: 'json',
    complete: longpoll
});

Ich habe es versucht:

$().off('ajaxStart');
$().off('ajaxStop');

..und die Handler nach dem Start der Umfrage wieder anbringen, aber keine Freude.

Ich habe auch versucht, eine globale Variable einzuführen handleAjaxStart(), die in der ersten Zeile der Funktion zurückgegeben wird, aber das scheint den Ladebildschirm vollständig zu zerstören.

Irgendwelche Ideen, wie dies erreicht werden kann?

Ich habe es herausgefunden..

Es gibt ein Attribut in den .ajax()aufgerufenen Optionsobjekten global.

Wenn der Wert auf false gesetzt ist, wird das ajaxStartEreignis für den Aufruf nicht ausgelöst .

$.ajax({
    timeout: 35000,
    url: longPollUrl,
    success: function(data){
        if(data.queCount) $('#numQueCount').html(data.queCount);
        if(data.queAccept) $('#numQueAccept').html(data.queAccept);
    }, 
    global: false,     // this makes sure ajaxStart is not triggered
    dataType: 'json',
    complete: longpoll
});

Nachdem ich alle möglichen Lösungen gelesen habe, möchte ich die Antworten kombinieren.

Lösung 1: Binden / Entbinden

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

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

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

Es ist eine abgeschriebene Lösung. Vor jQuery 1.9 können globale Ereignisse von Ajax wie AjaxStart, AjaxStop, AjaxError usw. an jedes Element gebunden werden. Nach jQuery 1.9:

Ab jQuery 1.9 müssen alle Handler für die globalen Ajax-Ereignisse von jQuery, einschließlich der mit der Methode .ajaxStart () hinzugefügten, an das Dokument angehängt werden.

Daher können wir diese Ereignisse nicht an benutzerdefinierte Namespaces binden / aufheben.

Lösung 2: Setzen Sie die Eigenschaft globalauffalse

$.ajax({
        url: "google.com",
        type: "GET",
        dataType: "json",
        global: false, //This is the key property.
        success: function (data) {
                   console.log(data);
                },
        error: function (data) {
                   console.log(data);
                }
       });

Diese Lösung deaktiviert ajaxStart()/ajaxStop()Ereignisse. Es macht jedoch auch deaktivieren ajaxComplete(), ajaxError(), ajaxSend(), ajaxSuccess(). Wenn Sie diese globalen Ereignisse nicht verwenden, scheint dies in Ordnung zu sein. Wenn dies jedoch erforderlich ist, müssen Sie Ihre Lösung für alle von Ihnen festgelegten Seiten ändern global: false.

Lösung 3: Verwenden Sie eine globale Variable

var showLoadingEnabled = true;
$(document).ready(function () {
    $('#loading')
        .hide()  // at first, just hide it
        .ajaxStart(function () {
            if (showLoadingEnabled) {
                $(this).show();
            }
        })
        .ajaxStop(function () {
            if (showLoadingEnabled) {
                $(this).hide();
            }
        });
});


function justAnotherFunction() {
    window.showLoadingEnabled = false;
    $.ajax({
        url: 'www.google.com',
        type: 'GET',
        complete: function (data) {
            window.showLoadingEnabled = true;
            console.log(data);
        }
    });
}

Globale Variablen sollten nicht in Javascript-Dateien verwendet werden. Dies ist jedoch die einfachste Lösung, die ich finden kann.

Ich habe die dritte Lösung für mein Projekt vorgezogen.