使用JavaScript在登录页面用用户输入用户名和密码,如果两者相等,则登录成功,跳转到欢迎页面;如果不成功,则不跳转,并显示登录错误
时间: 2023-09-18 17:11:17 浏览: 53
可以使用以下代码实现:
```html
<!DOCTYPE html>
<html>
<head>
<title>Login Page</title>
</head>
<body>
<h1>Login Page</h1>
<form name="loginForm" onsubmit="return validateForm()" method="post">
<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="Login">
</form>
<script>
function validateForm() {
var username = document.forms["loginForm"]["username"].value;
var password = document.forms["loginForm"]["password"].value;
if (username == password) { // check if username and password are equal
return true; // login successful, allow form submission
} else {
alert("Login error: Username and password do not match."); // show error message
return false; // prevent form submission
}
}
</script>
</body>
</html>
```
这段代码会创建一个登录页面,用户需要输入用户名和密码,并点击“Login”按钮来进行登录。当用户点击提交按钮时,`validateForm()`函数会被调用,该函数会获取表单中输入的用户名和密码,判断两者是否相等,如果相等则返回`true`,表示登录成功,允许表单提交;如果不相等则弹出一个提示框,显示错误信息,并返回`false`,阻止表单提交。如果表单提交成功,则会跳转到另一个页面。请注意,这个例子只是一个示例,实际上,为了安全起见,应该使用服务器端验证用户的用户名和密码,而不是仅在客户端进行验证。