2016-12-28 45 views
1

我正在使用ajax驗證我的登錄頁面。並以json的格式從數據庫中提取數據。我嘗試了很多時間&它適用於我,但它打印時提醒xmlhttp.readyState < 4使用ajax和json驗證登錄表單

<!DOCTYPE html> 
<html> 
<head> 
<title></title> 
<script type="text/javascript"> 
    function hey() 
    { 
    x="'"+document.login_tsms.user.value+"'"; 
    y="'"+document.login_tsms.pass.value+"'"; 

    var sql="select * from users where "+x+" IN (id,username)"; 

    var xmlhttp = new XMLHttpRequest(); 
    var count=0; 
    xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     var xx=xmlhttp.responseText; 
     var obj = JSON.parse(xx); 

     x=obj[0].id; 
     y=obj[0].username; 
     z=obj[0].password; 

     xx=document.login_tsms.user.value; 
     yy=document.login_tsms.pass.value; 

     if(x==xx || y==xx) 
     { 
      if(yy==z) 
      { 
       alert("ok man cool"); 
       //document.login_tsms.setAttribute("action","admin/admin.php"); 
      } 
      else 
      { 
       alert("Invalid username or password!"); 
      } 
     } 
     else 
     { 
      alert("Invalid username or password!"); 
     } 
    } 
    else 
    { 
      alert("Invalid username"); 
    } 
}; 
var url="db.php?q=read&sql="+sql; 
xmlhttp.open("REQUEST", url, true); 
xmlhttp.send(); 
} 
</script> 

 <div class="modal-body"> 
      <form name="login_tsms" action="login.php" method="post"> 
       <label style="font-size: 16px; font-weight: normal; margin-right: 35px;">User ID OR Name:</label> 

       <input required type="text" name="user" id="juser" style="border: 1px solid #ddd;border-radius: 4px;height: 40px;margin-bottom: 15px;padding-left: 12px;width: 406px;"/><br> 

       <label style="font-size: 16px; color: red; margin-left:165px;" id="uid_invalid"></label><br> 

       <label style="font-size: 16px; font-weight: normal; margin-right: 90px;">Password:</label> 

       <input autocomplete="off" type="password" name="pass" id="jpass" style="margin-left: 4px; border: 1px solid #ddd;border-radius: 4px;height: 40px;margin-bottom: 15px;padding-left: 12px;width: 406px;" required/><br> 

       <label style="font-size: 16px; color: red; margin-left: 165px;" id="upas_invalid"></label><br> 

       <input type="button" onclick="hey()" name="submit" value="Login" style="display: block;height: 40px;width: 136px; border: 1px solid #5973A8;font-size: 22px;margin-left: 165px;background-color:#5973A8;border-radius: 4px; color: #fff;letter-spacing: 1px;" /> 

       <br> 

       <h3 style="margin-left: 165px; margin-top: 0px;">Not a register user?<a id="gignup" href="signup.php">Sign up</a></h3> 

      </form> 
      <br>    
     </div> 

它爲我工作的罰款。 但它的打印(警告)「無效的用戶名」3次。 任何人都可以幫助我。

+0

'REQUEST'是不是HTTP動詞 – Musa

回答

0

在執行ajax期間onreadystatechange將被調用5次。這意味着當Ajax請求發生變化時,它會通知狀態更改功能。這些更改與客戶端創建,建立連接,收到標頭,收到內容,完成Ajax一樣。因爲你的條件(xmlhttp.readyState == 4 & & xmlhttp.status == 200)它進入真正的塊只有一次,在它進入假模塊,那麼所有其他情況下輸出「無效的用戶名」