JavaScript: 将密码设置为特定 div
JavaScript: Making password to a spesefic div
我正在做一些事情,但我现在没有任何代码,因为我不知道该怎么做!请帮帮我 :D
我觉得如果我能设置一个改变我风格的密码就好了:
<html>
<head>
<style>
.passwordProtected {
display:none; <- this is supposed to change to "block" when the password is written in, and they click "Show div"
}
</style>
</head>
<body>
<div id="loginArea">
<input type="password"> <--- This is where they type the password
</div>
<div id="passwordprotected" class="passwordProtected">
<h1>This is the protected div they enter</h1>
</div>
</body>
</html>
我该怎么办?
如果我没理解错的话,代码应该是这样的:
<html>
<head>
<style>
.passwordProtected {
display:none;
}
</style>
</head>
<body>
<div id="loginArea">
<input type="password">
<button onclick='showDiv();'>Show div</button>
</div>
<div id="passwordprotected" class="passwordProtected">
<h1>This is the protected div they enter</h1>
</div>
<script type="text/javascript">
function showDiv(){
var myDiv = document.querySelector('.passwordProtected');
myDiv.style.display = 'block';
}
</script>
</body>
</html>
您可以在此处找到有关 JavaScript 样式的更多信息:http://www.w3schools.com/jsref/dom_obj_style.asp。
我正在做一些事情,但我现在没有任何代码,因为我不知道该怎么做!请帮帮我 :D
我觉得如果我能设置一个改变我风格的密码就好了:
<html>
<head>
<style>
.passwordProtected {
display:none; <- this is supposed to change to "block" when the password is written in, and they click "Show div"
}
</style>
</head>
<body>
<div id="loginArea">
<input type="password"> <--- This is where they type the password
</div>
<div id="passwordprotected" class="passwordProtected">
<h1>This is the protected div they enter</h1>
</div>
</body>
</html>
我该怎么办?
如果我没理解错的话,代码应该是这样的:
<html>
<head>
<style>
.passwordProtected {
display:none;
}
</style>
</head>
<body>
<div id="loginArea">
<input type="password">
<button onclick='showDiv();'>Show div</button>
</div>
<div id="passwordprotected" class="passwordProtected">
<h1>This is the protected div they enter</h1>
</div>
<script type="text/javascript">
function showDiv(){
var myDiv = document.querySelector('.passwordProtected');
myDiv.style.display = 'block';
}
</script>
</body>
</html>
您可以在此处找到有关 JavaScript 样式的更多信息:http://www.w3schools.com/jsref/dom_obj_style.asp。