Ajax实现异步用户名验证功能

先看看布局比较简单，效果图如下

创建交互式、快速动态网页应用的网页开发技术功能：

当用户填写好账号切换到密码框的时候，使用创建交互式、快速动态网页应用的网页开发技术验证账号的可用性。检验的方法如下：首先创建对象对象，然后将需要验证的信息（用户名)发送到服务器端进行验证，最后根据服务器返回状态判断用户名是否可用。

函数check ACcount(){ var xmlhttp；var name=文档。getelementbyid(' account ').价值；如果(窗口. XMLHttpRequest)xmlhttp=new XMLHttpRequest()；else xmlhttp=new activexoobject(' Microsoft .XMLHTTP’)；打开(' GET '，' login.php？account=' name，true)；xmlhttp。send()；xmlhttp。onreadystatechange=function(){ if(xmlhttp。readystate==4 xmlhttp。status==200)文档。getelementbyid('帐户状态').innerHTML=xmlhttp。responsetext}运行结果

代码实现

index.html

！DOCTYPE html html hearteta charset=' UTF-8 '标题AJax登陆验证/title脚本类型=' text/JavaScript '函数CheckAccount(){ var xmlhttp；var name=文档。getelementbyid(' account ').价值；如果(窗口. XMLHttpRequest)xmlhttp=new XMLHttpRequest()；else xmlhttp=new activexoobject(' Microsoft .XMLHTTP’)；打开(' GET '，' login.php？account=' name，true)；xmlhttp。send()；xmlhttp。onreadystatechange=function(){ if(xmlhttp。readystate==4 xmlhttp。status==200)文档。getelementbyid('帐户状态').innerHTML=xmlhttp。responsetext} }/脚本/标题dydiv id=' content ' H2使用埃阿斯实现异步登陆验证/h2form账号：输入类型='text' id='account '需要自动对焦on bulr=' CheckAccount()'/input span id=' AccountStatus '/spanbrbr密码：输入类型='password' id='password '必填/input span id=' passwordStatus '/spanbrbrinput类型='submit '值='登陆/input/form/div/body/html登录服务器端编程语言（Professional Hypertext Preprocessor的缩写）

？PHP $ con=MySQL _ connect(' localhost '，' root '，' GDHL007 '，' sysu ')；if(！空($ _ GET[' account ']){ $ SQL 1=' select *从登录，其中帐户=' ' .$_GET['帐户']''';//数据库操作$ result 1=MySQL _ query($ con，$ SQL 1)；if(MySQL _ num _ rows($ result 1)0)echo ' font style=' color : # 00ff 00；'该用户存在/font '；else echo ' font style=' color : # FF0000；'该用户不存在/font '；MySQL _ close($ con)；} else echo ' font style=' color : # FF0000；'用户名不能为空/font '；以上就是本文的全部内容，希望对大家的学习有所帮助。