показ прогресса с нативными функциями jquery ajax

Question

проблема в том, что всякий раз, когда я использую $ .get, $ .post или $ .ajax, я не могу найти способ вызвать обратный вызов, когда сервер что-то обрабатывает. Я могу сделать это с помощью плагина ajaxform через метод beforeSubmit, но с ранее упомянутыми функциями я не могу найти способ сделать это. $ .ajax имеет метод beforeSend, но согласно документации все, что он делает, это вызывает «обратный вызов для изменения заголовков». Я хочу, чтобы обратный вызов сделал что-то вроде блокировки страницы, показать всплывающее окно, отобразить анимированный GIF и т. Д.

Есть ли способ показать, что сервер обрабатывает запрос с помощью загрузки $ .ajax, $ .get, $ .post, $ ()?

Заранее спасибо!

Answer 1

Я уже показал вам в другой вопрос о том, как вы можете использовать ajaxStart для этого.

Здесь я предложу еще один способ сделать это

$('.be-delete').live('click', function(e) {
    e.preventDefault();
    var object =$(this);
    // if request hasn't finished after 250ms show spinner
    // if request is fast the timer is canceled in success/error
    var timer = setTimeout(function() {
        //I use append here (instead of html()) which doesn't destroy original content
        //now you only need to use CSS img.spinner { ... } to position the spinner correctly
        object.parent().append('<img class="spinner" src="media/images/jquery/spinner.gif"/>');
    }, 250);
    var url = object.attr('href');
    $.ajax({
        url : url,
        error : function(){
            clearTimeout(timer);
            object.find("img#spinner").remove();
            alert('An error has occurred, no updates were made');
        },
        success : function() {
            clearTimeout(timer);
            object.parent().fadeOut('slow', function(){object.parent().remove()});
        }
    });
});

Answer 2

Вы ищете ajaxStart Я верю. Взгляните на пример.