在常见问题页面上切换

Question

我在div上使用onclick切换功能。 我将展示其中一个示例：

<div id="question1">
<a href="#" style="color: #FFF"
onclick="toggle('answer1');">Can I access my work from home?</a>
</div>

<div style="display:none" id="answer1">
You can't access you University drive from home, it is advised to back up your work onto a cloud such as Google Drive or Dropbox. You can however access your tasks and see what deadlines you have to meet using something called Blackboard.
</div>

因此，当我单击第一个问题时，第一个答案就会显示出来，我只想知道在单击问题2时如何隐藏？ 因此，最后不可能一次显示两个答案。

Answer 1

给答案divs一个类（例如answers ）以将它们标识为一个组，然后在每次toggle()时执行以下类似操作以隐藏所有答案。

function toggle(id){
   var answers = document.querySelectorAll('.answers');
   for(var i=0; i<answers.length; i++){
      answers[i].style.display = 'none';
   }

   // show the target
   document.getElementById(id).style.display = "block";
}