檢查與阿賈克斯jQuery的PHP MySQL用戶名

Question

我有表的用戶：

• ID：INT，
• 用戶名：VARCHAR（255），
• 密碼：VARCHAR（255），

我會檢查登錄是否存在於數據庫中

我試用這段代碼jquery和html：

<div class="form-group"> 
    <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">username <span class="required">*</span></label> 
    <div class="col-md-6 col-sm-6 col-xs-12"> 
     <input type="text" class="form-control col-md-7 col-xs-12" name="username " id="username "> 
      <span id="availablity"></span> 
    </div> 
</div> 
<script type="text/javascript"> 

    $('document').ready(function(){ 
      $('#username').blur(function(){ 
       var username = $(this).val(); 
       $.ajax ({ 
        url = "check.php", 
        method = "POST", 
        data = {username :username }, 
        dataType : "text", 
        success:function(html) 
        { 
         $('#availablity').html(html); 
        } 
       }); 
      }); 
    }); 
</script> 

頁check.php：

if(isset($_POST['username'])){ 
       $username = $_POST["username"]; 
       $sql = $db->query("SELECT * FROM users WHERE username = '$username'"); 
       if($sql->rowCount() > 0){ 
        echo '<span class="text-danger">Not Exist</span>'; 
       }else{ 
        echo '<span class="text-success">Exist</span>'; 
       } 

} 

但沒有結果

Answer 1

請嘗試下面的代碼。

JavaScript代碼

$('document').ready(function(){ 
      $('#username').change(function(){ 
       var username = $(this).val(); 
       $.ajax ({ 
        url : "check.php", 
        method : "POST", 
        data : {username :username }, 
        dataType: "text", 
        success:function(html) 
        { 
         $('#availablity').html(html); 
        } 
       }); 
      }); 
    }); 

而且你剛纔提到的id = 「用戶名」（有空格），請更改像如下。

<input type="text" class="form-control col-md-7 col-xs-12" name="username" id="username"> 

Answer 2

您已經使用=在你的Ajax配置。這是一個語法錯誤。使用

$.ajax({ 
    url: "check.php", 
    method: "POST", 
    data: {username: username}, 
    dataType: "text", 
    success: function (html) { 
     $('#availablity').html(html); 
    } 
}); 

改爲。

Answer 3

看起來jQuery的語法錯誤......

<script type="text/javascript"> 

    $('document').ready(function(){ 
      $('#username').blur(function(){ 
       var username = $(this).val(); 
       $.ajax ({ 
        url : "check.php", 
        method : "POST", 
        data : {username :username }, 
        dataType : "text", 
        success:function(html) 
        { 
         console.log(html); 
         $('#availablity').html(html); 

        }, 
        error: function(html) 
        { 
         console.log(html); 
        } 
       }); 
      }); 
    }); 
</script> 

檢查您的控制檯消息。

Answer 4

這應該是你的代碼：

$('document').ready(function(){ 
      $('#username').blur(function(){ 

       var username = $(this).val(); 
       $.ajax ({ 
        url :"check.php", 
        method: "POST", 
        data : {username :username }, 
        dataType : "text", 
        success:function(html) 
        { 
         $('#check').html(html); 
        } 
       }); 
      }); 
    });