用于显示隐藏内容的demo
准备做一个小静态网站,其中要做一个答题的功能,类似于英语的完形填空,点显示答案按钮以后,可以显示答案在上面,由于还没学过javascript,这个小功能也得请教同学啦。展示如下:
<br>--------------代码--------------<br>
<script type="text/javascript">
var hiddenOrShow = 0;
function clickMe() {
var div = document.getElementById('answerDiv');
var button=document.getElementById('aButton');
if (hiddenOrShow % 2 == 0) {
div.style.display = "block";
button.setAttribute("value", "Hide the answer");
} else {
div.style.display = "none";
button.setAttribute("value", "Show the answer");
}
hiddenOrShow++;
}
</script>
<a>click the button below and you can see the answer in the answer field</a>
<br />
<input id="aButton" type="button" value="Show the answer" onclick="clickMe()">
<br>
<div>
<ul>
<li>What's my Name?</li>
<li>
<div>the answer is:</div>
<div id="answerDiv" style="display: none"><a>Moper</a></div>
</li>
</ul>
</div>
<br>--------------展示--------------<br>
<script type="text/javascript">
var hiddenOrShow = 0;
function clickMe() {
var div = document.getElementById('answerDiv');
var button=document.getElementById('aButton');
if (hiddenOrShow % 2 == 0) {
div.style.display = "block";
button.setAttribute("value", "Hide the answer");
} else {
div.style.display = "none";
button.setAttribute("value", "Show the answer");
}
hiddenOrShow++;
}
</script>
<a>click the button below and you can see the answer in the answer field</a>
<br />
<input id="aButton" type="button" value="Show the answer" onclick="clickMe()">
<br>
<div>
<ul>
<li>What's my Name?</li>
<li>
<div>the answer is:</div>
<div id="answerDiv" style="display: none"><a>Moper</a></div>
</li>
</ul>
</div>
本作品采用 知识共享署名-相同方式共享 4.0 国际许可协议 进行许可。
博主研究的很深入啊
额 这个很简单吧 学过js的人应该都会 我是没学过 所以…… :-?