Javascript - 简单的登录重定向

Question

一直在阅读一些 JavaScript 教程并尝试制作一个简单的登录系统。我为此目的使用了以下代码。警报行正确执行，但重定向行似乎没有产生任何结果。

问题:我怎样才能让它发挥作用？代码有什么问题？

注意:我知道这不是一个安全的登录系统。我只需要它在满足不同条件时正确重定向。

我还尝试了不同的重定向行语法(删除引号、括号等)。它们似乎都不起作用……以防这只是一个语法错误。

代码:

<form name="loginForm" onsubmit="loginCheck()" method="post">
    <input type="text" name="userName"><br>
    <input type="text" name="passWord"><br><br>
    <input type="submit" value="Login">
</form>

<script>
function loginCheck() {
    var usr=document.loginForm.userName.value;
    var psw=document.loginForm.passWord.value;
    var username="admin";
    var password="admin";
    if ((usr==username) && (psw=password)) {
        alert ("True Info");
        window.location.href ("http://www.google.com");
        return true;
    }
    else {
        alert ("False Info");
        window.location.href ("http://www.google.com");
        return false;
    }
}
</script>

Answer 1

存在三个问题:

1. href 是一个字符串，而不是一个函数，因此将其作为函数调用将抛出异常并中止脚本
2. 您不会从事件处理程序返回 false，因此表单将提交并覆盖您要对 location 执行的任何操作
3. 您有一项作业要尝试进行比较

要解决此问题:

1. 为位置指定值:location = "http://www.google.com/";
2. 从事件处理程序返回:onsubmit="return loginCheck();"
3. 请注意使用 = 和 == 的位置。

<小时/>

请注意，内在事件属性是我们在 90 年代编写 JavaScript 的方式。编码实践已经改进，我们现在可以 separate concerns与 unobtrusive JavaScript .

function loginCheck(event) {
  var usr = this.elements.userName.value;
  var psw = this.elements.passWord.value;
  var username = "admin";
  var password = "admin";
  if ((usr == username) && (psw == password)) {
    alert("True Info - submitting form");
  } else {
    alert("False Info - going to Google");
    location = "http://www.google.com";
    event.preventDefault();
  }
}

document.getElementById('loginForm').addEventListener('submit', loginCheck);

<form id="loginForm" method="post">
  <input type="text" name="userName">
  <br>
  <input type="text" name="passWord">
  <br>
  <br>
  <input type="submit" value="Login">
</form>

<小时/>

另外，请注意，尝试完全在客户端进行身份验证是一件愚蠢的事情。它可以用作基本事件处理的示例，但永远不应该在实践中尝试。