4.利用ajax实现登录验证
1.在login.html中搭建框架 有用户名 密码 按钮
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title></title>
</head>
<body>
用户名: <input type="text" name="user" id="user"><br/>
密码: <input type="password" name="pass" id="pass"><br/>
<button id="getText">获取数据</button>
<div id="div"></div>
</body>
<script src="ajax.js" type="text/javaScript" charset="utf-8"></script>
<script>
var getText=document.getElementById("getText");
var user = document.getElementById("user");
var pass = document.getElementById("pass");
var div1 = document.getElementById("div");
getText.onclick=function(){
var url="ajax-login.php?user="+user.value+"&pass"+pass.value+"";
ajaxFn(url,succFn(data){
div1.innerHTML=data;
});
}
</script>
</html>
2.在ajax-login中通过用户传入的用户名和密码进行匹配
<?php
$user = $_GET["user"];
$pass = $_GET["pass"];
if($user == "karry" && $pass=="hello"){
echo "登录成功";
}else{
echo "登录失败";
}
?>
3.实现效果
随便输入一个用户名和密码
输入正确的
4.这种方法就是写死的 可以和数据库连接 对比数据库里的用户名和密码(下节讲解)