A tag/button prevents duplicate submissions & page loading production

"Principle of implementation"

The loading setting to prevent duplicate commits and page commits is committed, but the completed operation has not been processed and submitted as an asynchronous commit (synchronous commit does not need to be considered). Therefore, its implementation principle is that when the button or a tag is clicked, the button/a tag is set to be unavailable, and then the button/a tag is set to be available in the completion callback function. The loading principle is to create a loading style when you click Submit, and hide the style after the commit is complete.

[Sync]: Submit request, wait for server processing, processing completed returns this period the client browser cannot do anything
[Async]: Requests are processed through event triggering server processing (which is still something the browser can do)

"button to prevent duplicate submissions"

function Save () {    $ (' #submit '). attr ("Disabled",true);      //     function  (data) {        $ (' #submit '). attr ("Disabled",false);          //         //    });}

OS: Native JS processing: document.getElementById ("submit"). Disabled = true;

"A tag prevents duplicate submissions"

It is important to note that the a tag does not have a disabled attribute, so it is not working to control the commit of a tag using the button's method.

// Global Variables var true ; function Save () {    false;     function (data) {        true;         // ........ The rest of the code     });}

This method can also be used in the prevention of push buttons, which is generally a common and simple method.

"Loading"

In CSS:

<style> #loading{position:fixed;width:500px;Top:50%; Left:50%;margin:-25px-250px;Background-color:#FFFFFF;Border:1px solid #CCCCCC;text-align:Center;padding:25px; }</style>

In HTML:

<id= "Loading"  style= "Display:none"><   style= "vertical-align:middle;" src = "Images/loading.gif" /> Loading ... </ Div >

JS Code:

function Save () {    $ ("#loading"). CSS ("Display", "");     function (data) {        $ ("#loading"). CSS ("display", "none");         // ........ The rest of the code     });}

Reprint please specify the source:

http://www.cnblogs.com/llicat/

A tag/button prevents duplicate submissions & page loading production