jQuery Prompt for Password не хочет отображаться

$(document).ready(function() {
     $(document).display(none);
     
     var password =("You have just entered a private website. Please enter the password to access it!");
     if (password == "biology") {
      $(document).display();
     }
      else {
       window.location.replace("https://www.google.co.uk")
      };
    });
html {
     background-image: url("bg.jpg")
    }
    
    body {
     margin: 0 25%;
     background-color: #ccc;
    }
    
    nav li {
     padding-left: 5px;
     border: solid 5px #aaa;
    }
    
    nav ul {
     list-style-type: none;
     position: fixed;
     left: 9%;
     font-size: 36px;
    }
    
    nav a {
     color: #ccc;
     text-decoration: none;
    }
    
    article {
     background-color: white;
     border: white solid #c0c;
    }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!DOCTYPE html>
    <html lang="pl">
    
    <head>
     <title>Krystian Mikołajczyk</title>
     <link href="style.css" rel="stylesheet" type="text/css">
     <link href="jquery-2.1.1.js" type="text/javascript">
     <link href="pass.js" type="text/javascript">
    </head>
    
    <body>
    <header>
     <h1 align="center"><i>Krystian Mikołajczyk</i></h1>
    </header>
    
    <nav>
     <ul><i>
      <li><a href="#">Home</a></li>
      <li><a href="#">Uploads</a></li>
      <li><a href="#">Downloads</a></li>
      <li><a href="#">Contact</a></li>
     </i></ul>
    </nav>
    
    <br>
    <br>
    <br>
    
    <article>
     <section>
      <h1>Recent Update</h1>
     </section>
    </article>
    
    </body>
    </html>

Я пытался создать для себя веб-сайт, который мог бы использовать где угодно в любое время, и я хотел защитить его паролем, особенно если у меня будут некоторые загрузки и загрузки, которые я хотел бы сохранить для себя.

Предполагается, что пароль будет "биология", потому что я хотел бы, чтобы мой учитель биологии загрузил для меня PDF-книгу во время разработки.

Я не знаю, что я сделал не так, но быстрое сообщение не хотело появляться, и это то, что мне интересно.

Источник

2 ответа

Решение

ТЛ; др

У вас есть ошибки в вашем коде. Перейдите прямо к рабочей демоверсии.

.display (нет) является недействительным

$(document).display(none);

Это неверно, поскольку ни одна из них не является определенной переменной, либо удалите ее, либо используйте альтернативу:

$(document).css('display', 'none');

или же

$(document.body).hide();

Вам нужно подсказать пользователю

var password = ("You have just entered a private website. Please enter the password to access it!");

Это ничего не сделает, но вы можете использовать метод prompt для запроса ввода:

var password = prompt("You have just entered a private website. Please enter the password to access it!");

Операторы if-else не должны содержать точку с запятой (;)

else {
    window.location.replace("https://www.google.co.uk")
};

должно быть просто:

else {
    window.location.replace("https://www.google.co.uk")
}

Там может быть больше!

Проверьте свои инструменты разработчика, чтобы быть уверенным. Они классные!

Заметка

... что вы далеко не в безопасности, так как ваш пароль хранится в виде простого текста и его легко найти, просмотрев исходный код клиента. Существует много материалов о том, как правильно хэшировать пароли, хранить их и сравнивать с хешированными входными данными пользователя - но это уже другая история.

Источник 
$(document).display(none);

Ты имеешь в виду $(document).css('display', 'none');, Но действительно:

$(document.body).hide();

Поскольку объект документа не может быть скрыт, и hide() просто более читабельно.

Ты устанавливаешь password на длинную строку:

var password =("You have just entered a private website. Please enter the password to access it!");

Так что это никогда не будет равным "biology", Я полагаю, вы хотите сказать:

var password = prompt("You have just entered a private website. Please enter the password to access it!");

И наконец,

$(document).display();

должно быть:

$(document.body).show();


  $(document.body).hide();

  var password = prompt("You have just entered a private website. Please enter the password to access it!");
  if (password == "biology") {
    $(document.body).show();
  } else {
    window.location.replace("https://www.google.co.uk")
  };
html {
  background-image: url("bg.jpg")
}
body {
  margin: 0 25%;
  background-color: #ccc;
}
nav li {
  padding-left: 5px;
  border: solid 5px #aaa;
}
nav ul {
  list-style-type: none;
  position: fixed;
  left: 9%;
  font-size: 36px;
}
nav a {
  color: #ccc;
  text-decoration: none;
}
article {
  background-color: white;
  border: white solid #c0c;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<header>
  <h1 align="center"><i>Krystian Mikołajczyk</i></h1>
</header>

<nav>
  <ul><i>
  <li><a href="#">Home</a></li>
  <li><a href="#">Uploads</a></li>
  <li><a href="#">Downloads</a></li>
  <li><a href="#">Contact</a></li>
 </i>
  </ul>
</nav>

<br>
<br>
<br>

<article>
  <section>
    <h1>Recent Update</h1>
  </section>
</article>

Источник
Другие вопросы по тегам