This article mainly introduces in detail how javascript and jquery implement user login verification. If you are interested, refer to the example in the previous article.
1. Key Code implemented using jquery ajax
The implementation is as follows:
/* Jquery implementation $ (document ). ready (function () {$ ("# account "). blur (function (event) {$. ajax ({type: "GET", url: "checkAccount. php? Account = "+ $ (" # account "). val (), dataTypes: "text", success: function (msg) {$ ("# accountStatus" ).html (msg) ;}, error: function (jqXHR) {alert ("Account Error! ") },}) ;}); $ (" # Password "). blur (function (event) {$. ajax ({type: "GET", url: "checkPassword. php? ", DataTypes:" text ", data:" account = "+ $ (" # account "). val () + "& password =" + $ ("# password "). val (), success: function (msg) {$ ("# passwordStatus" ).html (msg) ;}, error: function (jqXHR) {alert ("password query error! ")},});});});*/
II. Key to javascript implementationCode
The implementation is as follows:
// Javascript implements function checkAccount () {var xmlhttp; var name = document. getElementById ("account "). value; if (window. XMLHttpRequest) xmlhttp = new XMLHttpRequest (); else xmlhttp = new ActiveXObject ("Microsoft. XMLHTTP "); xmlhttp. open ("GET", "checkAccount. php? Account = "+ name, true); xmlhttp. send (); xmlhttp. onreadystatechange = function () {if (xmlhttp. readyState = 4 & xmlhttp. status = 200) document. getElementById ("accountStatus "). innerHTML = xmlhttp. responseText ;}} function checkPassword () {var xmlhttp; var name = document. getElementById ("account "). value; var pw = document. getElementById ("password "). value; if (window. XMLHttpRequest) xmlhttp = new XMLHttpRequest (); Else xmlhttp = new ActiveXObject ("Microsoft. XMLHTTP"); xmlhttp. open ("GET", "checkPassword. php? Account = "+ name +" & password = "+ pw, true); xmlhttp. send (); xmlhttp. onreadystatechange = function () {if (xmlhttp. readyState = 4 & xmlhttp. status = 200) document. getElementById ("passwordStatus "). innerHTML = xmlhttp. responseText ;}}
The mysql and database sections are the same as those in the previous blog. The running results are as follows:
The above is all the content of this article, hoping to help you learn.