html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<input type="text" name="username" id="t1"/><span id="s"></span></br>
<input type="text" name="pwd"/>
</body>
</html>
<script>
let t1 = document.getElementById("t1");
let s = document.getElementById("s");
t1.onblur = function(){
//1.创建对象
let xhr;
if (window.ActiveXObject) {
//ie
xhr = new ActiveXObject("Microsoft.XMLHttp");
} else {
//非ie
xhr = new XMLHttpRequest();
}
//2.设置连接地址 get方式发送响应
//注意这部贼关键
xhr.open("get","isUserExist.php?name="+t1.value,true);
//3.设置响应事件
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
//5.获取响应字符串
//注意:前后端分离
if(xhr.responseText==1){
s.innerHTML = "用户名重复请重新输入";
}else{
s.innerHTML = "恭喜注册成功";
}
}
}
//4.发送
xhr.send();
}
</script>
php
<?php
header("Content-type:text/html;charset=utf-8");
//链接数据库
$conn = mysql_connect("localhost","root","root");
//获取请求过来的数据
if($conn){
mysql_select_db("mystudent");
}else{
echo "连接失败!";
}
$name = $_GET["name"];
$result = mysql_query("select * from student where stuName='$name'",$conn);
if(mysql_num_rows($result)==1){
echo "1";
}else{
echo "0";
}
?>