Подтвердить что ты не робот

Показать элемент, только если getJSON занимает больше, чем n миллисекунд?

У меня есть JavaScript:

surveyBusy.show();

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
        surveyBusy.hide();
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
        surveyBusy.hide();
    });

Тем не менее, я хотел бы оставить только surveyBusy.show();, если $.getJSON занимает больше, чем n число миллисекунд. В противном случае вы мерцаете. Есть ли ответ на getJSON api, который может это сделать? Я не вижу ничего в документации.

4b9b3361

Ответ 1

Просто используйте тайм-аут. Кроме того, я помещаю ваш "скрытый" код в обработчик always для уменьшения повторения кода.

var busyTimeout = setTimeout(function() { surveyBusy.show(); }, 2000);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
    })
    .always(function() {
        clearTimeout(busyTimeout);        
        surveyBusy.hide();        
    });

Ответ 2

Поместите ваш вызов surveyBusy.show() в таймаут и затем отмените этот тайм-аут (используя window.clearTimeout), если результат возвращается до его активации

var busyTimeout = window.setTimeout(function() { surveyBusy.show(); }, 500);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
    })
    .always(function() {
        window.clearTimeout(busyTimeout);        
        surveyBusy.hide();        
    });

Ответ 3

Используйте setTimeout:

var busy = window.setTimeout(function(){
    surveyBusy.show();
}, 1000);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        // ...
        window.clearTimeout(busy);
        surveyBusy.hide();
    })
    .fail(function (jqXHR, textStatus, err) {
        // ...
        window.clearTimeout(busy);
        surveyBusy.hide();
    });

Ответ 4

Попробуйте установить время ожидания, а затем отмените его, когда сервер отвечает:

// NOT TESTED

var n = 5000 // milliseconds
var tmr = setTimeout(function(){
    surveyBusy.show();
}, n);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
        clearTimeout(tmr) ;
        surveyBusy.hide();
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
        clearTimeout(tmr) ;
        surveyBusy.hide();
    });

Ответ 5

Это создаст метод в объекте surveyBusy, который позволит избежать создания метода setTimeout под объектом window. Это дает вам нечто гораздо более многоразовое!

surveyBusy = {
    onTimer: function(n) {
        elapsed = new Date.getTime() - start;
        if (elapsed > n) surveyBusy.show();
    }
}
surveyBusy.hide();
var start = new Date().getTime();
var elapsed = 0;

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
    })
    .always(function() {
        surveyBusy.onTimer(5000);
    });

Ответ 6

Собственно, согласно этой странице, которая описывает обратные вызовы для всех процедур AJAX, существует обратный вызов тайм-аута, который вы можете использовать. Это потребует, чтобы вы не использовали ярлык $.getJSON. Итак, чтобы предоставить РЕАЛЬНЫЙ ответ на вопрос, ДА, он находится в API, но похоронен глубже, чем $.getJSON.

timeout Тип: Number Установите тайм-аут (в миллисекундах) для запроса. Это переопределит любой глобальный тайм-аут с $.ajaxSetup(). Период ожидания начинается с момента вызова $.ajax; если выполняется еще несколько запросов, и в браузере нет доступных соединений, можно запросить тайм-аут перед его можно отправить. В jQuery 1.4.x и ниже объект XMLHttpRequest будет находиться в недопустимом состоянии, если запрос истечет; доступа к любым члены объекта могут выдать исключение. Только в Firefox 3.0+, scriptи запросы JSONP не могут быть отменены таймаутом; script будет, даже если он прибывает после периода ожидания.

Ответ 7

var n = 1000; //number of ms to wait
var done = false;
window.setTimeout(function(){
    if(!done){
        surveyBusy.show();
    }
}, n);

$.getJSON(apiUrl + '/' + id)
    .done(function (data) {
        ...
        done = true;
        surveyBusy.hide();
    })
    .fail(function (jqXHR, textStatus, err) {
        ...
                done = true;
        surveyBusy.hide();
    });