用html写登陆代码并验证密码正误
时间: 2023-12-24 09:06:00 浏览: 18
以下是一个简单的 HTML 登录表单代码,并使用 JavaScript 验证密码正误:
```html
<!DOCTYPE html>
<html>
<head>
<title>Login</title>
<script>
function validate() {
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
// 根据实际情况更改用户名和密码
if (username == "admin" && password == "123456") {
alert("登录成功!");
return true;
} else {
alert("用户名或密码错误!");
return false;
}
}
</script>
</head>
<body>
<h2>Login Form</h2>
<form onsubmit="return validate()">
<label for="username">Username:</label>
<input type="text" id="username" name="username"><br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password"><br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
```
在上面的代码中,我们首先定义了一个 `validate()` 函数,在表单提交时调用该函数进行验证。函数中通过 `document.getElementById()` 方法获取了用户名和密码输入框的值,并与预设的用户名和密码进行比较。如果匹配成功,则弹出一个提示框,显示“登录成功!”;否则弹出“用户名或密码错误!”的提示框。
需要注意的是,在表单中需要使用 `type="password"` 来定义密码输入框,这样输入的字符会被隐藏。