javascript - 显示/隐藏点击 div，所需 : one item displayed at a time

Question

我已经用 js 设置了一个显示/隐藏 div，但我很难弄清楚如何一次显示一个 div。目前发生的情况是，除非我再次单击原始链接来关闭该 div，否则每个 div 都会显示。

http://www.littlestoneacademy.com

Answer 1

首先尝试了解需求。需要的是在单击链接时显示一个 block 并隐藏其他 block 。只需使用 document.getElementById 并将 style.display 属性设置为 none 对于那些需要隐藏的内容，然后 block > 对于那些您需要展示的内容。

有一个类似这样的javascript(根据您的需要进行更改):

    <script type="text/javascript">
        function toggle(divName1,divName2,divName3){
            var div1=document.getElementById(""+divName1);
            div1.style.display="block";
            var div2=document.getElementById(""+divName2);
            div2.style.display="none";
            var div3=document.getElementById(""+divName3);
            div3.style.display="none";
        }
   </script>

和 html 代码:

 <a href="#" onclick="toggle('div1','div2','div3');">DIV 1</a><div id="div1" style="display:none">hello1</div><br/>
 <a href="#" onclick="toggle('div2','div1','div3');">DIV 2</a><div id="div2" style="display:none">hello2</div><br/>
 <a href="#" onclick="toggle('div3','div2','div1');">DIV 3</a><div id="div3" style="display:none">hello3</div><br/>