jquery酒店登录
时间: 2023-11-25 13:51:27 浏览: 30
以下是一个基于jQuery的酒店登录的示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>酒店登录</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#loginBtn").click(function(){
var username = $("#username").val();
var password = $("#password").val();
if(username == "" || password == ""){
alert("用户名和密码不能为空!");
}else{
$.ajax({
type: "POST",
url: "login.php",
data: {username: username, password: password},
success: function(data){
if(data == "success"){
alert("登录成功!");
window.location.href = "index.php";
}else{
alert("用户名或密码错误!");
}
}
});
}
});
});
</script>
</head>
<body>
<h2>酒店登录</h2>
<form>
<label>用户名:</label>
<input type="text" id="username"><br><br>
<label>密码:</label>
<input type="password" id="password"><br><br>
<input type="button" value="登录" id="loginBtn">
</form>
</body>
</html>
```
在这个示例中,我们使用了jQuery的ajax方法来实现异步登录。当用户点击登录按钮时,我们获取了输入框中的用户名和密码,然后通过ajax方法将其发送到login.php文件进行验证。如果验证成功,则跳转到index.php页面,否则提示用户名或密码错误。