使用纯JavaScript切换 函数切换菜单（）{ var thismmenu=document.getElementById（id.getElementsByTagName（'ul'）[0]； 如果（thisMenu.style.display=='block'）{ thisMenu.style.display='none'； }否则{ thisMenu.style.display='block'； } 返回此菜单； }

**说明*********

---

单击教程隐藏子菜单项，但如果我单击教程并将鼠标悬停在子菜单项上并将鼠标悬停在外，则项目列表项不会隐藏。如果我的代码需要修改，请告诉我。

您尚未定义

id

参数

改变

<script>
function toggleMenu() {
    var thisMenu = document.getElementById(id).getElementsByTagName('ul')[0];
    if( thisMenu.style.display == 'block' ) {
        thisMenu.style.display = 'none';
    } else { 
        thisMenu.style.display = 'block';
    }
    return thisMenu;
}

<li class="NavLinks test2" id="menuItem">
    <a onclick="toggleMenu('menuItem');">Tutorial</a>
    <ul>
        <li><a href="http://www.google.com">google</a></li>     
        <li><a href="http://www.yahoo.com">yahoo</a></li>
    </ul>
</li>

</script>

到

---

当前，

toggleMenu

函数不接受任何参数。html也在脚本标记中

function toggleMenu(id){

功能切换菜单（id）{
var thismmenu=document.getElementById（id.getElementsByTagName（'ul'）[0]；
如果（thisMenu.style.display=='block'）{
thisMenu.style.display='none'；
}
否则{
thisMenu.style.display='block'；
}
返回此菜单；
}

我粘贴错误。我也尝试了下面的代码：函数toggleMenu（id）{var thismmenu=document.getElementById（id）.getElementsByTagName（'ul'）[0]；if（thismmenu.style.display='block'）{thismmenu.style.display='none'；}else{thismmenu.style.display='block'；}返回thismmenu；}

谷歌

雅虎

我粘贴错误。我也试过你的代码。你确定它不起作用吗？我刚刚测试过它，它工作正常。但最初需要多次单击。将if条件更改为this并尝试

if（thismmenu.style.display=''| | | thismmenu.style.display=='block'）

在单击教程google和yahoo后，我可以看到它，但如果您将光标悬停在google上并将光标移出google，谷歌和雅虎不会隐藏他们不会隐藏在mouseout上，因为你只分配了onclick事件。要在鼠标上方和外侧显示/隐藏，必须将

onmouseover

和

onmouseout

事件添加到内部
。

function toggleMenu(id){

<script>
function toggleMenu( id ){
  var thisMenu = document.getElementById(id).getElementsByTagName('ul')[0];
  if( thisMenu.style.display == 'block' ) {
    thisMenu.style.display = 'none';
  }
  else {
    thisMenu.style.display = 'block';
  }
  return thisMenu ;
}
</script>
<li class="NavLinks test2" id="menuIteam">
<a onclick="toggleMenu('menuIteam');">Tutorial</a>
<ul>
<li><a href="http://www.google.com">google</a></li>     
<li><a href="http://www.yahoo.com">yahoo</a></li>
</ul>
</li>