<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>使用ajax登录页面</title>
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function () {
$('#Login').click(function () {
//1.获取用户名密码作为参数
username = $('#username').val()
password = $('#password').val()
//2.发起ajax请求
$.ajax({
'url': '/login_ajax_check',
'type': 'post',
'data': {'username':username,'password':password},
'dataType': 'json',
}).success(function (data) {
//登录成功{'res'；1}
//登录失败{'res'；0}
if(data.res ==0 ){
$('#error').show().html('用户名或密码错误')
}
else {
//跳转到主页
location.href = '/index'
}
})
})
})
</script>
<style>
#error{
display: none;
color: red;
}
</style>
</head>
<body>
<!-- get 提交参数在url上 post 提交参数在请求头上，安全性更高-->
<div>
用户名：<input type="text" id="username"><br/>
密码：<input type="password" id="password"><br/>
<input type="button" id="Login" value="登录">
<div id="error"></div>
</div>
</body>
</html>
995
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
