如果语句重定向未按预期工作

If statement re-direct not working as expected

本文关键字：工作 语句 重定向 如果      更新时间：2023-09-26

我正试图通过虚拟场景学习javascript，下面的内容将不会在实时上下文中使用。所有的html页面都在我的家庭服务器上，这就是为什么我没有在链接中使用http://etc。

如果我输入了正确的用户名和密码，我会尝试让以下代码将我带到"索引"页面，如果我输入错误，则会保留在"主页"上，但会显示"无效登录"的警告。如果我输入了正确的用户名和密码，我会被正确重定向，但是如果我在正确触发警报后输入了错误的用户名/密码，我也会被重定向到索引页面。

如何停止为错误的用户名/密码加载索引页？我确信我可能错过了一些简单的东西！

这是主页的html

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
<div id="container">
<div id="loginbox">
<form id="login" action="home.html">
Username: <input type="text" name="user" id="user"><br>
Password: &nbsp;<input type="password" name="password" id="password"><br>
<input type="submit" value="Login" onclick="checkUserName()">
</form>
</div>
</div>

这是脚本

function checkUserName() {
var User = document.getElementById("user").value;
var Password = document.getElementById("password").value;
if (User === "user123" && Password === "password123") {
    window.location = "index.html";
}
else  {
    alert("Invalid Login");
}
}

干杯！

在这种情况下，您不想提交表单。您只需要在点击登录时调用js函数。所以使用一个普通的按钮，而不是提交。

<button onclick="checkUserName()">login</button>

当您使用提交按钮时，表单将被提交，除非您没有阻止e.preventDefault()或从被称为的js函数返回false的默认操作

function checkUserName() {
var User = document.getElementById("user").value;
var Password = document.getElementById("password").value;
if (User === "user123" && Password === "password123") {
    window.location = "index.html";
}
else  {
    alert("Invalid Login");
}
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
<div id="container">
<div id="loginbox">
<form id="login" action="home.html">
Username: <input type="text" name="user" id="user"><br>
Password: &nbsp;<input type="password" name="password" id="password"><br>
<button onclick="checkUserName()">login</button>
</form>
</div>
</div>

相关文章：