用js写一个登陆页面
时间: 2023-10-20 21:07:13 浏览: 39
好的,以下是一个简单的登录页面的HTML和JavaScript代码。
HTML代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>登录页面</title>
<script src="login.js"></script>
</head>
<body>
<h1>欢迎登录</h1>
<form>
<label for="username">用户名:</label>
<input type="text" id="username" name="username" required><br>
<label for="password">密码:</label>
<input type="password" id="password" name="password" required><br>
<input type="button" value="登录" onclick="checkLogin()">
<input type="reset" value="重置">
</form>
</body>
</html>
```
JavaScript代码:
```javascript
function checkLogin() {
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
if (username == "" || password == "") {
alert("用户名或密码不能为空!");
} else if (username == "admin" && password == "123456") {
alert("登录成功!");
} else {
alert("用户名或密码错误!");
}
}
```
这个登录页面中,用户需要输入用户名和密码,然后点击“登录”按钮,就会调用`checkLogin()`函数进行验证。如果用户名或密码为空,弹出提示框提示用户不能为空;如果用户名和密码都正确,弹出提示框提示登录成功;否则弹出提示框提示用户名或密码错误。