The priority of Ajax execution in jquery

Source: Internet
Author: User
Tags json php code

This article tells you is the individual to do user registration when the implementation of Ajax encountered the priority of the problem, as well as the help of netizens, to solve the whole process of this problem, recorded here, share to everyone.

Today in doing user registration: Found a strange problem, please see the code:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 $ (' input[name= "username"]). blur (function () {//validate format var pattern =/^[a-z][w]{4,11}$/i; if (!pattern.test ($ (this). Val ( )) {$ (this). Siblings ('. Desc '). html (' <font style= color:red; " >5-12 characters, must start with a letter, can only enter numbers, letters and underscores </font> '); return false; //Verify that the user name is registered $.post (' Register.php?act=checkuser ', {username:$ (this). Val ()},function (data) {if (Data.status = = ' Error ') {$ (' input[name= ' username] '). Siblings ('. Desc '). html (' <font style= ' color:red; " > ' +data.info+ ' </font> '); return false;   }}, ' JSON '; Success alert (' Success '); $ (this). Siblings ('. Desc '). html (' '); });

The format above is, according to reason,

1, verify that the user name is in line with the format

2, the format is correct and Ajax to determine whether the user name is occupied,

3, all success will display the correct icon,

But the problem is that when I verify that the user format is successful, it executes directly, alert (' Success '), and then executes Ajax, why? Is it a matter of time for Ajax execution? or something else???

This is the PHP code:

?

1 2 3 4 5 6 7 8 9 10 11 12-13 if ($_get[' act '] = = ' CheckUser ') {if ($_server[' http_x_requested_with ']!== ' XMLHttpRequest ') exit (' Illegal operation!!!   ');   $sql = "Select id from {$sys _vars[' db_pre ']}user WHERE username= ' {$_post[' username ']} '"; $result = mysql_query ($sql); $data = Mysql_fetch_assoc ($result); if ($data) {exit (Json_encode array (' status ' => ' ERROR ', ' info ' => ') The username has been registered!!! '))); }else{exit (Json_encode (' status ' => ' success '));}

Analysis is as follows

Ajax is an asynchronous operation, and when performing AJAX-related functional functions, the system returns the function, then requests it, and returns it to the user by invoking the callback function when the request results are received.

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22-23 $ (' input[name= "username"]). blur (function () {//validate format var pattern =/^[a-z][w]{4,11}$/i; if (!pattern.test ($ (this). Val ( )) {$ (this). Siblings ('. Desc '). html (' <font style= color:red; " >5-12 characters, must start with a letter, can only enter numbers, letters and underscores </font> '); return false; //Verify that the user name is registered $.post (' Register.php?act=checkuser ', {username:$ (this). Val ()},function (data) {if (Data.status = = ' Error ') {$ (' input[name= ' username] '). Siblings ('. Desc '). html (' <font style= ' color:red; " > ' +data.info+ ' </font> '); return false;   }, function (data) {//For post functions, the third parameter is callback function alert (' Success ');}, ' json '); Successful//alert (' success '); $ (this). Siblings ('. Desc '). html (' '); });

Revise this, try, and experience the difference.

The use of callback functions for different AJAX functions is slightly different and can be referenced in the W3school tutorial or jquery website.

This is actually JS synchronous and asynchronous problems, asynchronous words you can imagine two lines

Copy code code as follows:

--performing a function call--regular validation--initiating the ajax--function to return the AJAX callback

| |

| |

Browser requests--php processing--The browser receives the result

If you want the function to return after the Ajax callback, you can change the top model, for example:

Copy code code as follows:

--performing function calls--regular validation--initiating AJAX Ajax callbacks--function return

| |

| |

Browser requests--php processing--The browser receives the result

This can be done by modifying jquery's launch Ajax asynchronous or synchronous way!

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 The $ (' input[name= ' username "] '). blur (function () {//Validation grid var pattern =/^[a-z][w]{4,11}$/i; if (!pattern.test (). Val ()) {$ (this). Siblings ('. Desc '). html (' <font style= ' color:red; " >5-12 characters, must start with a letter, can only enter numbers, letters and underscores </font> '); return false; //Verify that the username is registered var ajaxcheckuser = false; $.ajax ({type: POST), url: "Register.php?act=checkuser", data: {username:$ (this). Val ()},//note here Async:false Success:fu Nction (data) {if (Data.status = = ' Error ') {$ (' input[name= ' username '] '). Siblings ('. Desc '). html (' <font style= ' color : Red; " > ' +data.info+ ' </font> '); return false; else {Ajaxcheckuser = true;}}, ' JSON ';   if (ajaxcheckuser) {//Success alert (' success ');//$ (this). Siblings ('. Desc '). html (' '); }  });

The above is the entire contents of this article, I hope you can enjoy.

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.