AJAX = Asynchronous JavaScript and XML(異步的 JavaScript 和 XML)。
AJAX 不是新的程式設計語言,而是一種使用現有标準的新方法。
AJAX 最大的優點是在不重新加載整個頁面的情況下,可以與伺服器交換資料并更新部分網頁内容。
AJAX 不需要任何浏覽器插件,但需要使用者允許JavaScript在浏覽器上執行。
簡單案例:
用戶端
<form action="checkNumber.php" method="get">
手機号:<input type="text" name="phoneNumber" id="pnumber">
<span id="numbertips"></span><br>
使用者名:<input type="text" name="username" id="username" id="username">
<span id="usertips"></span><br>
<input type="submit">
</form>
<script>
//ajax請求就是HTTP請求(post、get)
var pnumber=document.querySelector("#pnumber");
var username=document.querySelector("#username");
//當手機号文本框失焦
pnumber.onblur=function(){
//1.定義請求對象
var xhr=new XMLHttpRequest();
//2.準備發送網絡請求
//第一個參數dataType:post、get
//第二個參數背景請求位址
//第三個參數同步或者異步
xhr.open("get","04-checkNumber.php?phoneNumber="+pnumber.value,true);
//3.發送網絡請求
xhr.send();
//4.執行回調
xhr.onreadystatechange=function(){
//這個回調函數不是執行一次
if (xhr.readyState==4&&xhr.status==200) {
numbertips.innerHTML=xhr.responseText;
}
}
}
</script>
伺服器端:
<?php
$number=$_GET["phoneNumber"];
if($number!="18336053333"&&$number!=""){
echo "此手機号可以注冊";
}else{
echo "此手機号不可以注冊";
}
?>