用戶名可用性檢查使用AJAX

我目前正在嘗試開發一個PHP的小網站來測試我的技能。但是，當我決定實施註冊過程的實時用戶名可用性檢查時，我發現自己陷入了困境，因爲我的JavaScript知識有點基本。用戶名可用性檢查使用AJAX

現在，當我在用戶名字段中輸入一些名稱時，我只能得到加載圖像，而沒有其他東西。這是我做了什麼：存儲在/ views文件夾

我的login.php頁：

<section> 
    <div> 
     <form action="?action=login" method="post"> 
      <input type="text" placeholder="username" name="username" id="username" onkeypress ="check()"> 
      <span id="usernameStatus"></span> 
     </form> 
    </div> 
</section>

我的js文件存儲在/視圖/ JS：

function check() { 
    var status = document.getElementById('usernameStatus'); 
    var u = document.getElementById('username').value; 
    if(u != ""){ 
     status.innerHTML = '<img src="views/img/wait.gif" alt="" height="20" />'; 
     var hr = new XMLHttpRequest(); 
     hr.open("POST", "../login.php", true); 
     hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 

     hr.onreadystatechange = function() { 
      if(hr.readyState == 4 && hr.status == 200) { 
       status.innerHTML = hr.responseText; 
      } 
     } 

     var v = "checkName="+u; 
     hr.send(v); 

    } 
}

最後的loginController.php存儲在/ controllers：

public function run() { 
     if(!empty($_POST["checkName"])){ 
      $name= htmlentities($_POST["checkName"]); 
      if(Db::getInstance()->username_ok($name)){ 
       echo ("<strong>" . $name . "</strong> unavailable"); 
      } 
      else{ 
       echo ("<strong>" . $name . "</strong> available"); 
      } 
     } 
     require_once('views/login.php'); 
    }

有人能解釋我我做了什麼錯嗎？謝謝！

來源

2015-07-05 g6431827

是什麼觸發你的JavaScript？你有在輸入欄上註冊的事件監聽器嗎？ – L4zl0w

您是否在瀏覽器的網絡查看器中檢查了AJAX操作？查看請求參數，響應代碼和響應文本以幫助您進行調試。 – halfer

您好thaks爲答覆。在調試中，我有''無法加載資源：服務器響應狀態爲404（未找到）「和」無法加載資源：net :: ERR_CACHE_MISS「。我認爲問題是js文件沒有連接loginController.php，但我不知道如何解決它。 – g6431827

我認爲問題在於文件名。

從你的問題，我想的文件結構是

root 
|-- controllers 
| `-- loginController.php 
`-- views 
    `-- js 
     `-- script.js

在你的JavaScript代碼，它是文件views/js/scriptname.js中，

hr.open("POST", "../login.php", true);

請求被髮送到文件login.php。

但是，正如你所提到的，你的服務器端PHP腳本的路徑是/controllers/loginController.php。

根據我的JavaScript代碼應如下：

hr.open("POST", "controllers/loginController.php", true);

來源

2015-07-05 19:25:48

你對我的錯誤是正確的，但由於某種原因，當我使用我的瀏覽器debuger它說'POST http：//localhost/controllers/LoginController.php 404（Not Found）'。 – g6431827

通過更改controllers/loginController.php的路徑來修復404錯誤。 – g6431827

如果您的問題得到解決，那麼「接受」這個答案是一個很好的做法，因爲它對將來訪問此問題的每個人都有幫助。 –

這裏是一個tutorial這將幫助你，它是一個活的用戶名檢查與PHP和jQuery。

來源

2015-07-05 18:43:32

謝謝修復了404錯誤。我會檢查這一點，並嘗試使其適應我的代碼。 – g6431827

用戶名可用性檢查使用AJAX

回答

相關問題