Отключите ajaxStart() и ajaxStop() для конкретного запроса

Я использую .ajaxStart() и .ajaxStop(), чтобы показать модальность, пока выполняется запрос ajax. (между запуском и остановкой)

Теперь я хотел бы добавить функцию longpoll, которая будет ждать уведомлений, аналогичную той, которая находится в верхнем углу верхнего угла этого сайта.

Теперь моя проблема заключается в отключении этого модального кода только для запроса longpolling.

Регистрация "загрузки экрана" вкл. и выкл. обработчики:

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

Моя функция longpoll:

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

Я пробовал:

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

.. и повторное подключение обработчиков после запуска опроса, но без радости.

Я также попытался ввести глобальную переменную в handleAjaxStart(), которая вернется в первую строку функции, но, похоже, полностью уничтожит экран загрузки.

Любые идеи о том, как это можно достичь?

Ответ 1

Я понял это.

В объекте options .ajax() есть атрибут, который называется global.

Если установлено значение false, это событие не вызовет событие ajaxStart для вызова.

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

Ответ 2

Прочитав все возможные решения, я хочу объединить ответы.

Решение 1: Bind/Unbind

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

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

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

Это амортизированное решение. Перед jQuery 1.9 глобальные события ajax, такие как ajaxStart, ajaxStop, ajaxError и т.д., Могут быть привязаны к любому элементу. После jQuery 1.9:

Как и в jQuery 1.9, все обработчики для глобальных событий Ajax jQuery, включая те, которые добавлены с помощью метода .ajaxStart(), должны быть прикреплены для документирования.

Поэтому мы не можем привязывать/развязывать эти события к пользовательским пространствам имен.

Решение 2. Задайте свойство global false

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

Это решение работает, чтобы отключить событие ajaxStart()/ajaxStop(). Однако он также отключает ajaxComplete(), ajaxError(), ajaxSend(), ajaxSuccess(). Если вы не используете эти глобальные события, это выглядит нормально, но когда это необходимо, вы должны вернуться и изменить свое решение для всех страниц, на которых вы установили global: false.

Решение 3: используйте глобальную переменную

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

Глобальные переменные не должны использоваться в файлах javascript. Однако это самое простое решение, которое я могу найти.

Я предпочел третье решение для моего проекта.