<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript">
function checkname(){
//ajax校验用户名
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState==4){
document.getElementById('result').innerHTML = xhr.responseText;
}
}
//获得输入的用户名，并传递个服务器端
var ming = document.getElementById('username').value;
//对ming变量的特殊符号信息进行编码
ming = encodeURIComponent(ming);
xhr.open('get','./04.php?nm='+ming+'&age=23');
xhr.send(null);
}
</script>
</head>
<body>
<h2>ajax之get形式请求</h2>
<p>用户名：<input type="text" id="username" onblur="checkname()" /></p>
<p>密码：<input type="password" id="userpwd" /></p>
<div id="result"></div>
</body>
</html>
<?php
/**
* Created by PhpStorm.
* User: bochaoceng
* Date: 1/2/18
* Time: 10:44
*/
$exists = array('linken','mary','jim');
$name = $_GET['nm'];
if ( in_array($name ,$exists)){
echo "<span style='color: red'> 用户名已经存在，请换一个</span>";
}else{
echo "<span style='color: green'> 恭喜 可以试用此名字</span>";
}
