Ajax怎麼實作非同步使用者名稱驗證

這次帶給大家Ajax怎麼實現非同步使用者名稱驗證，Ajax實作非同步使用者名稱驗證的注意事項有哪些，以下就是實戰案例，一起來看一下。

先看看版面比較簡單，效果圖如下

#ajax功能：

    當使用者填寫好帳號切換到密碼框的時候，使用ajax驗證帳號的可用性。檢驗的方法如下：先建立XMLHTTPRequest對象，然後將需要驗證的資訊（使用者名稱）傳送到伺服器端進行驗證，最後根據伺服器傳回狀態判斷使用者名稱是否可用。

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","login.php?account="+name,true);
xmlhttp.send();
 
xmlhttp.onreadystatechange=function(){
 if (xmlhttp.readyState==4 && xmlhttp.status==200)
  document.getElementById("accountStatus").innerHTML=xmlhttp.responseText;
}

運行結果

程式碼實作

index.html

使用Ajax实现异步登陆验证

账 号：


密 码：

login. php

<?php
  $con = mysqli_connect("localhost","root","GDHL007","sysu");
 
  if(!empty($_GET[&#39;account&#39;])){
    $sql1 = &#39;select * from login where account = "&#39;.$_GET[&#39;account&#39;].&#39;"&#39;;
    //数据库操作
    $result1 = mysqli_query($con,$sql1);
    if(mysqli_num_rows($result1)>0)
      echo '<font style="color:#00FF00;">该用户存在</font>';
    else 
      echo '<font style="color:#FF0000;">该用户不存在</font>';
    mysqli_close($con);
  }else
    echo '<font style="color:#FF0000;">用户名不能为空</font>';
 
?>

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

關於Ajax的探討和研究

#AJAX怎麼實現非同步刷新和局部刷新

以上是Ajax怎麼實作非同步使用者名稱驗證的詳細內容。更多資訊請關注PHP中文網其他相關文章！