1

我找到了这段代码：

<html>
<head>
  <script type="text/javascript" charset="utf-8">
  function showHide(elementid){
    if (document.getElementById(elementid).style.display == 'none'){
      document.getElementById(elementid).style.display = '';
    } else {
      document.getElementById(elementid).style.display = 'none';
    }
  }
  </script>
</head>
<body>
  <div><a href="javascript:showHide('div_1035677');">more...</a></div>
  <div id="div_1035677" style="display:none">
    HIDDEN CONTENT
  </div>
  <div><a href="javascript:showHide('div_1035678');">more...</a></div>
  <div id="div_1035678" style="display:none">
    HIDDEN CONTENT
  </div>

现在，它允许人们使用我的网站来扩展所有内容。我只想一次允许一个。因此，如果他们单击其他人，它会自动关闭所有其他人。你怎么能在纯js中做到这一点？

4

1 回答 1

1

您可以将所有要自动关闭的 div 放入一个名为的类hiders或其他东西中，并在您的showHide()函数中，在使它们可见之前，使该类的所有成员不可见。像这样：

function showHide(elementid){

    var hiders = document.getElementsByClassName("hiders");
      for(var i =0;i<hiders.length;i++){
        hiders[i].style.display = "none";
      }

    if (document.getElementById(elementid).style.display == 'none'){
      document.getElementById(elementid).style.display = '';
    } else {
      document.getElementById(elementid).style.display = 'none';
    }
}

<div><a href="javascript:showHide('div_1035677');">more...</a></div>
<div class="hiders" id="div_1035677" style="display:none">
    HIDDEN CONTENT
</div>
<div><a href="javascript:showHide('div_1035678');">more...</a></div>
<div class="hiders" id="div_1035678" style="display:none">
    HIDDEN CONTENT
</div>
于 2013-10-26T20:58:42.743 回答