HTML JavaScript用IF语句重定向用户不起作用
我想使用用户输入来确定用户是否被重定向到另一页。在这种情况下，用户输入一个用户名和密码。如果用户名和密码正确，则将用户重定向。为此，我使用简单的JavaScript和HTML：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1">
<title>Login</title>
<!-- the form awesome library is used to add icons to our form -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css"> -->
<!-- include the stylesheet file -->
<link href="login.css" rel="stylesheet" type="text/css">
<script>
function testResults (form) {
var given_username = form.username.value;
var given_password = form.password.value;
var correct_username = "123";
var correct_password = "123";
if (given_username == correct_username && given_password == correct_password) {
window.location.assign("redirected.html");
}
else {
alert("Wrong username and/or password.")
}
}
</script>
</head>
<body>
<div class="login">
<h1>Login</h1>
<form action="" method="get">
<label for="username">
<!-- font awesome icon -->
<i class="fas fa-user"></i>
</label>
<input type="text" name="username" placeholder="Username" id="username" required>
<label for="password">
<i class="fas fa-lock"></i>
</label>
<input type="password" name="password" placeholder="Password" id="password" required>
<input type="submit" value="Login" onclick="testResults(this.form)" />
</form>
</div>
</body>
</html>
但是，当我填写正确的用户名和密码时，在这种情况下，我根本不会重定向。什么都没有发生。
但是，当我根本不使用if语句时：
<script>
function testResults (form) {
window.location.assign("redirected.html");
}
</script>
它可以正常工作。也就是说，每当您按下提交按钮时，都会重定向。但是，在这种情况下，用户根本不必填写凭据，因此，在我的情况下，这并不多。
我尝试过window.location，location.assign，location.href，location.replace.replace and variants，但所有结果都产生相同的结果。
我该如何解决或解决这个问题？
I want to use user input to decide whether or not the user is redirected to another page. In this case, the user inputs a username and password. If the username and password is correct, then the user is redirected. For this, I use simple javascript and html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1">
<title>Login</title>
<!-- the form awesome library is used to add icons to our form -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css"> -->
<!-- include the stylesheet file -->
<link href="login.css" rel="stylesheet" type="text/css">
<script>
function testResults (form) {
var given_username = form.username.value;
var given_password = form.password.value;
var correct_username = "123";
var correct_password = "123";
if (given_username == correct_username && given_password == correct_password) {
window.location.assign("redirected.html");
}
else {
alert("Wrong username and/or password.")
}
}
</script>
</head>
<body>
<div class="login">
<h1>Login</h1>
<form action="" method="get">
<label for="username">
<!-- font awesome icon -->
<i class="fas fa-user"></i>
</label>
<input type="text" name="username" placeholder="Username" id="username" required>
<label for="password">
<i class="fas fa-lock"></i>
</label>
<input type="password" name="password" placeholder="Password" id="password" required>
<input type="submit" value="Login" onclick="testResults(this.form)" />
</form>
</div>
</body>
</html>
However, when I fill in the correct username and password, in this case '123', I don't get redirected at all. Nothing happens.
But, when I don't use an if statement at all:
<script>
function testResults (form) {
window.location.assign("redirected.html");
}
</script>
it works correctly. That is, whenever you press the submit button, you get redirected. However, in this case the user does not have to fill in credentials at all, so in my case this is not of much use.
I have tried window.location, location.assign, location.href, location.replace and variants, but all yield the same result.
How can I solve or work around this?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
this.form是错误的。另外，您可以考虑使用onsubmit事件：
this.formis wrong.also, you might consider using the onsubmit event: