Вимкніть ajaxStart () та ajaxStop () для конкретного запиту


77

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

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

Зараз моя проблема полягає у відключенні цього способу лише для запиту довгого опитування ..

Реєстрація "екрану завантаження" на обробники та вимикачі:

$(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()яка повертається в перший рядок функції, але це, здається, повністю вбиває екран завантаження.

Будь-які ідеї, як цього можна досягти?

Відповіді:


189

Я зрозумів це..

Існує атрибут в опції, яку .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
});

4
Дуже раді, що вони задумали саме такий сценарій, що нам доведеться обійти ці загальнодоступні функції ajax. Встановлення глобального значення false пригнічує всі глобальні тригери:, а ajaxComplete(), ajaxError(), ajaxSend(), ajaxStart(), ajaxStop(), ajaxSuccess()не лише Start і Stop.
XstiX

14

Прочитавши всі можливі рішення, я хочу поєднати відповіді.

Рішення 1: Зв’язати / Розв’язати

//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. Однак це найпростіше рішення, яке я можу знайти.

Я віддав перевагу третьому рішенню для свого проекту.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.