Scene
How do I achieve the "ajaxstart" effect on a particular request?
First, rewriting Ajax methods is too expensive to take advantage of JQuery's own Ajax Events.
Global events triggered by Ajax are propagated to all DOM nodes like a standard event. Levels: JQuery Events > Ajax Event > Custom Ajax incidents.
Realize
Copy Code code as follows:
Wo = window. Wo | | {};
Wo.ajax = {
Spinner: $ ([])
, Init:function () {
var $spinner = This.spinner = $ (' #ajax-loading ');
var show = function (e) {
if (e.namespace = = = ' Wo ') $spinner. Show ();
};
var hide = function (e) {
$spinner. Hide ();
};
$spinner. Bind ({
' Ajaxstart.wo ': Show
, ' Ajaxstop.wo ': Hide
, ' Ajaxerror.wo ': Hide
});
THIS.ADAPT ([' Getjson ', ' get ', ' post ', ' Ajax ']);
}
Prepare to send a request
, _prepare:function () {
This.spinner.trigger (' Ajaxstart.wo ');
}
Interface Bulk Change
, Adapt:function (FNS) {
var self = this;
$.each (Fns,function (I,FN) {
WO[FN] = function () {
Self._prepare ();
$[fn].apply (this,arguments);
}
});
}
};
There are two ways to determine whether a triggered event is a specific event:
The identified namespace.
Pass extra arguments to the event handler when triggered.
Here the event namespace is used to determine the trigger source. The Adapt method is equivalent to the adapter's application and replaces another set of interfaces with a set of improved interfaces.
If you want to increase the load method, it's a little bit cumbersome, because it might be an Ajax method or an element's onload event.
To add an agent method and make a type judgment:
Copy Code code as follows:
var _load = $.fn.load;
$.fn.load = function () {
$.type (arguments[0]) = = ' String ' && self._prepare ();
_load.apply (this,arguments);
return this;
};
Use
All method parameters are still consistent with the original:
Copy Code code as follows:
Wo.post (URL, [data,] callback)
