Примеры фрагментов кода jQuery о том, как использовать функции jQuery.ajaxStart и jQuery.ajaxStop . Примеры ниже.
Использование методов ajaxStart и ajaxStop
В приведенном ниже примере мы использовали его для отображения загружаемого изображения и отключения кнопки отправки формы после ее нажатия во время обработки запроса ajax. И затем, когда он возвращается, изображение скрыто, и кнопка отправки снова становится доступной.
var $form = $('#form'); $form.find('.loading') .hide() .ajaxStart(function() { $(this).show(); $form.find('.submit').attr('disabled', 'disabled'); }) .ajaxStop(function() { $(this).hide(); $form.find('.submit').removeAttr('disabled'); });
Использование вставленного кода перед ajax
Другим методом может быть добавление изображения перед вызовом ajax.
//show loading image, disable submit button $form.find('.msg').remove(); $form.find('.loading').show(); $form.find('.submit').attr('disabled', 'disabled');
А затем добавьте полный обработчик к функции ajax.
//hide loading image, enable submit button again complete: function() { $form.find('.loading').hide(); $form.find('.submit').removeAttr('disabled'); }
Использование ajaxSetup ()
Еще один метод — использовать jQuery.ajaxSetup, чтобы изображение было скрыто и форма была включена, когда все запросы ajax возвращаются «выполненными».
$.ajaxSetup( { complete:function() { $form.find('.loading').hide(); $form.find('.submit').removeAttr('disabled'); } });