如何在调用菜单作为mysql获取数组时使用javascript隐藏菜单选项

关于下拉菜单有很多答案。但我从数据库中调用菜单项

如果我单击某个菜单项（

$table[0]

），将显示内容（

。$table[0].-content

），如果我再次单击，内容将消失。到目前为止还不错

问题是，若某些内容已经打开，而我单击了另一个菜单项，那个么我会同时打开这两个内容。如何允许仅打开最后选定的且仍保留切换功能

我尝试过很多东西，这是其中之一：

<?php
include 'connect_database.php';  
$result = mysqli_query($con, "show tables"); 
while($table = mysqli_fetch_array($result)) { 
echo '<button onclick="' . $table[0] . 'myFunction()">' . $table[0] . '</button><br />
     <div id="' . $table[0] . '" style="display:none;"   class="tabcontent">' . $table[0] . ' - content</div>
     <script>
     function ' . $table[0] . 'myFunction() {
     var x = document.getElementById("' . $table[0] . '");
     if (x.style.display === "none") {
     x.style.display = "block";
     } else {
     x.style.display = "none";
     }}
     </script>';
} 
?>

---

只要在单击元素时关闭所有元素即可。我会选择课堂选择黑客，尽管它可以通过多种方式完成：

<?php
include 'connect_database.php';  
$result = mysqli_query($con, "show tables"); 
while($table = mysqli_fetch_array($result)) { 
echo '<button onclick="' . $table[0] . 'myFunction()">' . $table[0] . '</button><br />
     <div id="' . $table[0] . '" style="display:none;"   class="tabcontent">' . $table[0] . ' - content</div>
     <script>
     function ' . $table[0] . 'myFunction() {
         var x = document.getElementById("' . $table[0] . '");
         if (x.style.display === "none") {
             x.style.display = "block";
         } else {
             x.style.display = "none";
         }
         // Select all elements
         var els = document.querySelectorAll(".tabcontent);
         for (var i = 0, el; el = els[i]; i++) {
             if (el != x) { // Do not hide current element
                 x.style.display = "none";
             }
         }
     }
     </script>';
} 
?>



Protip：保持缩进清洁。
您的问题是没有跟踪创建的所有菜单。
另外，
myFunction
对所有函数都是相同的，因此很可能只需定义一个：）
我会这样做：

<?php
   include 'connect_database.php';  

   $result = mysqli_query($con, "show tables"); 
   while($table = mysqli_fetch_array($result)) { 
       $name = $table[0];
       echo "<button onclick='myFunction(\"$name\")'>$name</button><br /><div id='$name'  style='display:none;'   class='tabcontent'>$name - content</div>";
   }
?>
<script>
  function myFunction(id) {
     registerId(id);
     hideAll(id);

     var x = document.getElementById(id),
         s = x.style.display;

      x.style.display = (s === "none") ? "block" : "none";
  }
  // register a new id so we know what to hide when needed
  function registerId (id) {
    var m = window.myMenus = window.myMenus || [];

    if(m.indexOf(id) === -1) {
       m.push(id);
    }
  }

  // hide all registered menus except the id
  function hideAll(id) {
    var m = window.myMenus = window.myMenus || [],
        i, l=m.length;

    for(i=0;i<l;i++){
      if(m[i] == id) continue;
      var x = document.getElementById(m[i]);

      x.style.display = 'none';
    }

  }
 </script>

如果没有php，这不会是一个问题…：/分享你的javascript代码Abdul，分享代码是什么意思？我把javascript代码放在php的echo中。谢谢你的回答。恐怕现在无法打开任何内容。我需要新鲜空气，我将尝试改善。@MichalKotus用F12检查你的Chrome（我猜）控制台，看看有没有任何错误。pefect！非常感谢。给你一些啤酒：）
php code remains the same as before
<script>
  function myFunction(id) {
      var x,old;

     if(old = window.lastOpenId) {
        x = document.getElementById(old);
        x.style.display = "none";
        delete window.lastOpenId; 
     }

     if(id != old) {
        x = document.getElementById(id);
        x.style.display = "block";
        window.lastOpenId = id;
     }
  }
</script>