参考自博主“让心开始”的文章https://www.cnblogs.com/cuikang/p/5260558.html，感觉例子基本功能有登陆交互了，简单明了，可以做参考，后面我这个懒虫慢慢改进吧。
先是index.html
<!--index.html-->
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ajaxLogin</title>
<!--懒得下jquery，直接线上引用地址-->
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
<body>
<!--ajax不用刷新页面-->
<h1>登录页面</h1>
<div>用户名:<input type="text" id="uid" /></div><br />
<div>密 码:<input type="text" id="pwd" /></div><br />
<div><input type="button" value="登陆" id="btn"/></div><br />
</body>
<script type="text/javascript">
$(document).ready(function(e) {
$("#btn").click(function(){
var uid = $("#uid").val();
var pwd = $("#pwd").val();
$.ajax({ //Json数据
url:"chuli.php",//传输到哪个页面处理
data:{uid:uid,pwd:pwd},//传输哪些数据过去Json
type:"POST",//传输方式
dataType:"TEXT",//返回类型 字符串
success: function(data){ //执行成功之后执行的方法 又称为回调函数
if(data == "OK")
{
//登录成功操作，这里是跳到4399
window.location= "http://www.4399.com";
}
else
{
alert(data);
}
}
});
})
});
</script>
</html>
然后到chuli.php
$uid=$_POST["uid"];
$pwd=$_POST["pwd"];
//数据库ip（放在服务器本地就直接localhost），数据库账号，数据库密码，你所用的数据库名称
$db=new mysqli("localhost","root","root","test");
if(mysqli_connect_error())
{
echo "连接错误";
}
else
{
//user2是用户信息所在的表，分别有username和password两项，需要对应起来
$sql="select count(*) from user2 where username='".$uid."' and password='".$pwd."'";
$result=$db->query($sql);
$row=$result->fetch_row();
if($row[0]==0)
{
echo "用户名或密码错误";
}
else
{
echo "OK";
}
}
?>
把这两个文件放在同一个文件夹，直接拖到phpstudy的WWW根目录下，然后试试在浏览器中访问，就可以了。
网友评论