写一个用户账号秘密登录的页面,当点击登录按钮的时候,使用ajax向后端发送登录请求
时间: 2024-06-01 08:11:26 浏览: 29
<!DOCTYPE html>
<html>
<head>
<title>用户登录</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#login-form").submit(function(event){
event.preventDefault(); // 阻止表单默认提交行为
var username = $("#username").val();
var password = $("#password").val();
$.ajax({
url: "login.php",
method: "POST",
data: { username: username, password: password },
success: function(response){
if(response == "success"){
alert("登录成功!");
window.location.href = "dashboard.php";
} else {
alert("登录失败,请检查用户名和密码!");
}
},
error: function(){
alert("登录失败,请检查网络连接!");
}
});
});
});
</script>
</head>
<body>
<h1>用户登录</h1>
<form id="login-form">
<label for="username">用户名:</label>
<input type="text" id="username" name="username"><br><br>
<label for="password">密码:</label>
<input type="password" id="password" name="password"><br><br>
<input type="submit" value="登录">
</form>
</body>
</html>