登录用户密码验证htmljs
时间: 2023-09-09 10:12:43 浏览: 40
密码验证是一个常见的前端验证需求,可以使用HTML和JS来实现。
首先,在HTML中创建一个表单,包含一个用户名输入框和一个密码输入框:
```
<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="button" value="登录" onclick="validate()">
</form>
```
接下来,在JS中编写一个验证函数`validate()`。该函数获取用户名和密码输入框的值,然后将其与预设的用户名和密码进行比较。如果输入的用户名和密码与预设值相匹配,则跳转到登录成功页面;否则,提示用户输入有误。
```
function validate() {
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
if (username == "admin" && password == "123456") {
window.location.href = "success.html";
} else {
alert("用户名或密码错误,请重新输入!");
}
}
```
可以根据实际情况修改以上代码,比如加入更多的验证逻辑或者UI效果。