For the first time using $.ajax (), I did not differentiate between an AJAX asynchronous request and a synchronous request, just starting with a synchronous request, and then there were many problems, especially in terms of experience.
Asynchronous and synchronous:
Synchronization means executing a program to execute the next paragraph, which is blocking mode, which behaves on the Web page-the browser locks the page (that is, the so-called suspended animation state), the user cannot manipulate the other, must wait for the current request to return data. Instead of using asynchronous requests, the page does not appear suspended animation.
Improve user experience:
When the user submits the data waiting for the page to return the results will take time, sometimes the wait time is longer, in order to improve the user experience, we usually give "processing, please wait a moment." "Such a hint. We can do this by setting the parameter Beforesend () under $.ajax (),
eg
HTML Key Code
<div id= "Warning" ></div>
The key code in the JS file
$.ajax (function () {
.
.
.
Some parameters are omitted, only async and beforesend are given here.
Async:false,//synchronous request, asynchronous (true) by default
Beforesend:function () {
$ (' #warning '). Text (' Processing, please wait a moment. ');
}
});
Note that if you follow the sync settings async:false, $ (' #warning '). Text (' Processing, please wait a moment. In the Web page, there is no effect at all, if it will be $ (' #warning '). Text (' Processing, please wait a moment. Change to alert (' Test '), and a popup appears immediately before sending the request, indicating that Beforesend: is executed, but replaced by something like $ (' #warning '). Text (' is processing, please wait a moment. '); No prompt appears when the request returns a result. I was puzzled about this question for a long time, but I still don't know what the problem is.
To change the synchronization request to an asynchronous request, the above problem is gone,
Beforesend:function () {
$ (' #warning '). Text (' Processing, please wait a moment. ');
}
will be executed immediately.
