1. HTML 表單欄位
設定欄位名稱及Javascript要抓取的ID為 account
<input name="username" class="form-control" id="account" type="text" value="" onkeyup="checkRegAcc()">
<span class="text-danger" id="msg_username"></span>
2. JQUERY Ajax 設定語法
網頁 先載入 jquery <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<!-- Ajax -->
<script>
$(document).ready(function(){
checkRegAcc = function() {
if ($('#account').val().length >= 2) {
$.ajax({
url: 'mag_admin_check.php', // 判斷欄位是否存在的程式
type: 'GET', // 傳遞的方法
data: {
username: $('#account').val()
},
error: function(xhr) { // 設定錯誤訊息
alert('Ajax request 發生錯誤');
},
success: function(response) { // 將回傳的訊息寫入網頁中
$('#msg_username').html(response);
$('#msg_username').fadeIn();
}
});
} else {
$('#msg_username').html('');
}
};
});
</script>
3. PHP 判斷用的程式碼, 參考用，請依實際表單欄位更改
require 'config.inc.php'; // 連線資料庫
if (isset($_GET['username'])) {
$rs = $pdo->prepare("SELECT * FROM `admin` WHERE `username`=:username");
$rs->bindParam(':username', $_GET['username']);
$rs->execute();
$d = $rs->fetchObject();
if ($d->username == '') {
$ret = "此帳號可以使用";
} else {
$ret = "此帳號已經有人使用";
}
echo $ret;
}
參考資料 http://fecbob.pixnet.net/blog/post/43025230-php%28asp.net%29%2Bjquery%2Bajax%E5%B8%B3%E8%99%9F%E6%AA%A2%E6%9F%A5
