多个切换几乎像Tabs JavaScript / CSS

我想创建function类似于切换的标签，但是一次只能激活一个切换。 选项卡的内容也需要位于选项卡本身之上。 问题是我使用循环来生成内容以及标签本身。

我在这里有一个很好的JavaScript代码，工作得非常好。 我完全理解这一点。 唯一的问题是，当单击另一个切换时，它显然不会禁用其他切换。 还有一个“标签”/“切换”始终有效。 可能用前缀“post”检查div id并使所有div id与“post”显示的代码：除了点击的那个之外没有。 如果可能的话，这将是完美的。 我能想到的另一种方法是将所有生成的内容放入容器中，它只是禁用容器中除了单击的内容之外的所有id。

如果可以修改此代码来实现这一点，那就太棒了。 这是一些我非常清楚地理解的非常简单的代码。 我需要的是它的行为更像是制表符，其中只有一个可以同时处于活动状态。

 function toggleMeMirror(a){ var e=document.getElementById(a); if(!e) return true; if(e.style.display=="none"){ e.style.display="inline" } else { e.style.display="none" } return true; }  

HTML / PHP

循环1 – 内容

 have_posts()) : $queryepisodemirrors->the_post(); ?>  <div id="post-" style="display:none;">