0

$(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 书。

我不知道我做错了什么,但提示消息不想出现,这就是我想知道的。

4

2 回答 2

1

tl;博士

您的代码中有一些错误。直接进入工作演示

.display(none) 无效

$(document).display(none);

这是无效的,因为 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")
}

可能还有更多!

检查您的开发人员工具以确定。他们太棒了!

笔记

...因为您的密码以纯文本形式存储,并且通过查看客户端的源代码很容易找到,所以您不可能安全。有很多关于如何正确散列密码、存储密码并将它们与用户的散列输入值进行比较的材料——但那是另一回事了。

于 2015-01-26T20:10:05.090 回答
0
$(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>

于 2015-01-26T20:11:03.780 回答