jquery ajax Submission "Load in" prompt processing method _ajax

Method 1: Use the Ajaxstart method to define a global "load ..." The prompt

$ (function () {
$ ("#loading"). Ajaxstart (function () {
$ (this). html. ("});
$ ("#loading"). Ajaxsuccess (function () {
$ (this). html. ("");
$ (this). empty (); or clear it directly.
});

}）;

<div id= "Loading" ></div>

Attention:

All of the AJAX submissions will trigger the Ajaxstart event, which will be defined in the

<div id= "Loading" ></div>

The location shows "Loading ..." "Icon (of course you can also define text, but a load of the picture is more good-looking);

-------But it must be noted that at the same time to define a good ajaxsuccess event, Ajax submitted successfully after the icon to hide ...

Special tips:

When using Ajaxstart or ajaxsuccess events, the equivalent of defining a global display "load ..." "The location of all AJAX submissions" Loading ... "Icon is always displayed in one place ....

Method 2: In the Ajax method, define any position shown in the "Load ..." The prompt

$ (' #ajax_test2 '). Click (function () {
$.ajax ({
URL----URL path, depending on what you need,
Type: ' Post ',
Data: ' NAME=ZXCVB ',
timeout:15000,
Beforesend:function (XMLHttpRequest) {
Alert (' Remote call begins ... ');
$ ("#loading"). html. ("},
Success:function (data,textstatus) {
Alert (' Start callback, state text value: ' +textstatus+ ' returns data: ' +data ');
$ ("#loading"). empty ();
},
Complete:function (xmlhttprequest,textstatus) {
Alert (' Remote call succeeded, status text value: ' +textstatus ');
$ ("#loading"). empty ();
},
Error:function (Xmlhttprequest,textstatus,errorthrown) {
Alert (' Error ... Status text value: ' +textstatus+ ' exception information: ' +errorthrown ';
$ ("#loading"). empty ();
}
});
});

< input type.= "button" id= "Ajax_test2" value= "ajax Mode" >
<div id= "Loading" ></div>

Obviously, when Beforesend, the "Load ..." is displayed at the specified location. "Icon, after the error, complete, success the icon removed ....

Attention:

When there are multiple AJAX submissions on a page, it is recommended that the second approach be used, because "Loading ... "icon can be displayed in any location you need to refresh ... This is its advantage: freedom ....