Я думаю, ти маєш рацію. Цей метод занадто глобальний ...
Однак - це гарний дефолт, коли ваш дзвінок AJAX не впливає на саму сторінку. (фонове збереження, наприклад). (ви завжди можете вимкнути його для певного виклику ajax, передавши "global": false - див. документацію на jquery
Коли виклик AJAX призначений для оновлення частини сторінки, мені подобається, що мої "завантажувальні" зображення мають специфічний характер для оновленого розділу. Я хотів би побачити, яка частина оновлена.
Уявіть, як було б круто, якби ви могли просто написати щось на кшталт:
$("#component_to_refresh").ajax( { ... } );
І це показало б "завантаження" на цьому розділі. Нижче наведена функція, яку я написав, що також обробляє "завантажувальний" дисплей, але він характерний для області, яку ви освіжаєте в аяксе.
Спочатку дозвольте показати вам, як ним користуватися
<!-- assume you have this HTML and you would like to refresh
it / load the content with ajax -->
<span id="email" name="name" class="ajax-loading">
</span>
<!-- then you have the following javascript -->
$(document).ready(function(){
$("#email").ajax({'url':"/my/url", load:true, global:false});
})
І це функція - базовий старт, який ви можете покращити за своїм бажанням. він дуже гнучкий.
jQuery.fn.ajax = function(options)
{
var $this = $(this);
debugger;
function invokeFunc(func, arguments)
{
if ( typeof(func) == "function")
{
func( arguments ) ;
}
}
function _think( obj, think )
{
if ( think )
{
obj.html('<div class="loading" style="background: url(/public/images/loading_1.gif) no-repeat; display:inline-block; width:70px; height:30px; padding-left:25px;"> Loading ... </div>');
}
else
{
obj.find(".loading").hide();
}
}
function makeMeThink( think )
{
if ( $this.is(".ajax-loading") )
{
_think($this,think);
}
else
{
_think($this, think);
}
}
options = $.extend({}, options); // make options not null - ridiculous, but still.
// read more about ajax events
var newoptions = $.extend({
beforeSend: function()
{
invokeFunc(options.beforeSend, null);
makeMeThink(true);
},
complete: function()
{
invokeFunc(options.complete);
makeMeThink(false);
},
success:function(result)
{
invokeFunc(options.success);
if ( options.load )
{
$this.html(result);
}
}
}, options);
$.ajax(newoptions);
};