打开另一页 - HTML / Javascript

时间:2018-03-23 21:22:11

标签: javascript html login

这是我的整个HTML代码, 我不明白为什么它不打开“example.html”页面。 如果有人能帮我理解原因。 我想确保当凭据正确并按下登录按钮时它会将我引导到一个新文件(在本例中为“example.html”),但我不知道为什么没有发生

<html>

<head>
    <title>Login</title>
    <link rel="stylesheet" href="css/css1.css">
    <script type="text/javascript">
        var message = "Right Click Disabled!";

        function rtclickcheck(keyp) {
            if (navigator.appName == "Netscape" &&
                keyp.which == 3) {
                alert(message);
                return false;
            }
            if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) {
                alert(message);
                return false;
            }
        }
        document.onmousedown = rtclickcheck;

        function check(form) {
            if (form.username.value == "admin" && form.password.value == "123") {
                window.open("example.html")
            } else {
                alert("Username Or Password Doesn't Match!");
            }
        }
    </script>
</head>

<body>

    <div class="form-box">
        <div class="head">LOGIN</div>
        <div id="textbox">
            <form>
                <input type="text" placeholder="Username" name="username">
                <br>
                <input type="password" placeholder="Password" name="password">
                <br>
                <input type="submit" onclick="check(this.form)" name="btn_submit" value="Login">
            </form>
        </div>
    </div>
</body>

</html>

3 个答案:

答案 0 :(得分:1)

单击“提交”按钮后,表单将被提交,浏览器将重新加载页面(因为您未在表单中指定操作)。

您需要阻止提交viq JavaScript(check out Event.preventDefault() ),或者将输入提交到带有类型按钮的按钮,以便单击它不会提交表单。

var message = "Right Click Disabled!";

function rtclickcheck(keyp) {
  if (navigator.appName == "Netscape" &&
    keyp.which == 3) {
    alert(message);
    return false;
  }
  if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) {
    alert(message);
    return false;
  }
}
document.onmousedown = rtclickcheck;



function check(form) {

  if (form.username.value == "admin" && form.password.value == "123") {
    window.open("example.html")
  } else {
    console.log("Username Or Password Doesn't Match!");
  }
}
<body>

  <div class="form-box">
    <div class="head">LOGIN</div>
    <div id="textbox">
      <form>
        <input type="text" placeholder="Username" name="username">
        <br>
        <input type="password" placeholder="Password" name="password">
        <br>
        <button type="button" onclick="check(this.form)" name="btn_submit">button</button>
      </form>
    </div>
  </div>
</body>

答案 1 :(得分:1)

表单提交取消重定向,反之亦然。 请改用以下代码:

<html>
<head>
  <title>Login</title>
  <link rel="stylesheet" href="css/css1.css">
  <script type="text/javascript">
     var message = "Right Click Disabled!";
     function rtclickcheck(keyp) {
     if (navigator.appName == "Netscape" && keyp.which == 3) {
     alert(message);
     return false;
     }
     if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) {
     alert(message); return false;
     }
     }
     document.onmousedown = rtclickcheck;

     function check(form)
     {
         if(form.username.value == "admin" && form.password.value == "123")
         {
             window.location.replace("example.html");
            return false;
         } else
         {
             alert("Username Or Password Doesn't Match!");
            return false;
         }
     }
  </script>
</head>
<body>
  <div class="form-box">
     <div class="head">LOGIN</div>
     <div id="textbox">
        <form onsubmit="return check(this);">
           <input type="text" placeholder="Username" name="username">
           <br>
           <input type="password" placeholder="Password" name="password">
           <br>
           <input type="submit" name="btn_submit" value="Login">
        </form>
     </div>
  </div>
</body>
</html>

答案 2 :(得分:-1)

工作正常。 请确保example.html与您的登录html页面所在的路径相同。还要检查@Andrew_CSE

提到的弹出窗口阻止程序