<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>AJAX初识</title>
<script type
="text/javascript">
window
.onload = function() {
var btn
= document
.getElementById("btn");
btn
.onclick = function() {
var uname
= document
.getElementById("username").value
;
var pass
= document
.getElementById("pass").value
;
var xhr
= new XMLHttpRequest();
xhr
.open('get','01check.php?username=' + uname
+ '&password=' + pass
, true);
xhr
.send(null);
xhr
.onreadystatechange = function() {
if (xhr
.readyState
== 4) {
if(xhr
.status
= 200) {
var data
= xhr
.responseText
;
var info
= document
.getElementById("info");
if (data
== "1") {
info
.innerHTML
= '登录成功'
} else {
info
.innerHTML
= '用户名或密码错误';
}
}
}
}
}
}
</script
>
</head>
<body>
<form>
用户名: <input type="text" name="username" id="username">
<span id="info"></span>
<br />
密码: <input type="password" name="pass" id="pass">
<input type="button" value="登录" id="btn">
</form>
</body>
</html>
01check.php↓↓↓
<?php
$uname = $_GET['username'];
$pass = $_GET['password'];
if($uname == "admin" && $padd = "123") {
echo "1";
}else{
echo "2";
}
?>
