Question

我已经编写了以下代码片段以在我的网站上启用密码，但是如果我导航到浏览器上的不同选项卡，则密码提示会消失，此功能不再有用。

 function passWord(title) {

       var pwd = prompt(title);

       switch (pwd) {
         case '2017': true;
           break;

         case null: passWord('Access Denied - Password Incorrect, Please Try Again.');
           break;

         default: passWord('Access Denied - Password Incorrect, Please Try Again.');
       }
     }

我在body标签中调用此函数。

   <body onload="passWord('Please enter password here')">

Answer 1

您可以使用focus事件查看用户何时返回您的页面：

var didEnterPassword = false;

window.addEventListener("focus", function(e){
    if(!didEnterPassword && prompt("hello again") == "my secret password"){
        didEnterPassword = true;
    }
})

请注意，这是非常不安全，因为任何人在开始挖掘您的代码时都可以获得my secret password。

Answer 2

您可以尝试以下方法：

<style>#screen {display: none;}</style>
<body onload="passWord();">
  <div id="welcome">
    <h1>Welcome Page</h1>
  </div>
  <div id="screen">
    <h1>Unique Page</h1>
  </div>
  <script>
    function passWord() {
      var welcome = document.getElementById("welcome");    
      var screen = document.getElementById("screen");
      var pwd = prompt("Enter your password", "TYPE HERE");
      switch(pwd) {
        case "2017":
          screen.style.display = "block";
          welcome.style.display = "none";
        break;
        default:
          screen.style.display = "none";
          welcome.style.display = "block";
      }
    }
  </script>
</body>

作为@Caleb Black评论 - 如果安全问题，最好使用php来做这件事。祝你好运！

Answer 3

您可以使用while循环，只要用户未发送答案，该循环就一直运行：

var pwd;
while(pwd == null) pwd = prompt(title);

请注意，它不会保留失去焦点之前输入的任何文本。

导航到其他选项卡时，JavaScript提示窗口消失

3 个答案: