Copy code code as follows:
/*AJAX submitted delay waiting effect*/
var ajaxLoding = New Object ();
// wraperid: the container element that displays the Loding picture
// MS: The length of the loding icon is displayed, milliseconds
// Envent: The source of the event event of the event is used to obtain the object of the departure event
// Callback: Represents the recovery method executed after the animation is over
// Stop () Method indicates the operation of the hidden animation operating after the recovery method is successfully executed
AjaxLoding.load = Function (Lodingid, MS, Event, Left, Top, callback) {
if (! Left || Typeof left == Undefined)
left = 0;
if (! Top || Typeof Top == Undefined)
TOP = 0;
this.Lodingid = lodingid; // Display the Parent element of the Loding icon
this.Obj = $ ("#" + this.Lodingid);
this.sourceEvengenelement = $ (event.currentTarget);
this.Start = Function () {
this.Obj.css ({POSITIN: "Relative"});
this.sourceEveentelement.attr ("disabled", true);
// Display the icon icon and lodingid by default, and set the following style
VAR Imgobj = $ ("<IMG SRC = '/Images/Loaderc.gif' Style =' Position: AbSolute; width: 32px; height: 32px; 'ID =' IMG_LODING '" ");
imgobj.css ({left: this.Obj.width () / 2- Imgobj.width () / 3-heft, top: this.obj.height () / 2-imgobj.heigh () / 2-top}) ;;
imgobj.appendto (this.Obj);
this.Obj.animate ({height: this.obj.height ()}, ms, function () {
callback ();
});
};
this.Stop = Function () {
$ ("#IMG_LODING"). Remove ();
this.sourceEveentelement.attr ("disabled", false);
}
};
Calling method:
Copy code code as follows:
$ ("#Elementid"). CLICK (Function (E) {
var obj = new ajaxLoding.load ("div_test", 2000, e, 0,0, function () {
// Alert ("Successful submission!");
obj.stop (); // Hide the loading icon
});
obj.start ();
});
This is the Loding icon I use, you can replace it yourself.