Javascript在按钮点击时隐藏正文并在窗口点击时显示

时间:2014-03-17 06:36:30

标签: javascript html

我有一些Javascript / HTML代码,当按下按钮时会隐藏HTML页面上的正文:

<html>
 <head>
 <link rel="stylesheet" href="android.css" type="text/css" />
 </head>
 <body class="services">
<div id="container">
<nav class="top">
    <a href="user.html">User</a>
    <a class="active" href="shop.html">Shop</a>
    <a href="staff.html">Staff</a>
</nav>
<h1>Shop Details</h1>
<form>
    <input type="radio" name="Great" value="Great">Great<br />
    <input type="radio" name="Good" value="Good">Good<br />
    <input type="radio" name="Satisfactory" value="Satisfactory">Satisfactory<br />
    <input type="radio" name="BelowAverage" value="BelowAverage">Below Average<br />
    <input type="radio" name="Poor" value="poor">Poor<br />
    <textarea placeholder="Comments to go here" rows="8" cols="33"></textarea>
</form>
<h1>Cleanliness</h1>
<form>
    <input type="radio" name="Great" value="Great">Great<br />
    <input type="radio" name="Good" value="Good">Good<br />
    <input type="radio" name="Satisfactory" value="Satisfactory">Satisfactory<br />
    <input type="radio" name="BelowAverage" value="BelowAverage">Below      Average<br />
    <input type="radio" name="Poor" value="poor">Poor<br />
    <textarea placeholder="Comments to go here" rows="8" cols="33"></textarea>
</form>
<h1>Retail interaction</h1>
<form>
    <input type="radio" name="Great" value="Great">Great<br />
    <input type="radio" name="Good" value="Good">Good<br />
    <input type="radio" name="Satisfactory" value="Satisfactory">Satisfactory<br />
    <input type="radio" name="BelowAverage" value="BelowAverage">Below Average<br />
    <input type="radio" name="Poor" value="poor">Poor<br />
    <textarea placeholder="Comments to go here" rows="8" cols="33"></textarea>
</form>
</div>
<nav class="bottomFixed">
    <a class="home" href="index.html">Home</a>
    <a class="hide" href="#" onclick="hideDoc();">Hide</a>
</nav>
</body>
<script type="text/javascript"> 
function hideDoc() {
    document.getElementsByTagName('body')[0].style.display="none";

}
</script>

我想要的是在通过按钮启用功能后单击或触摸窗口(必须能够使用触摸屏设备)时,身体标签将再次显示。

1 个答案:

答案 0 :(得分:3)

你试过吗

window.onclick = function() { document.getElementsByTagName('body')[0].style.display=""; }

您应该在<script>中插入<head>

以下是一个示例:FIDDLE