Question

<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>

的的 ** 描述的 * ** * ** * *

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

Answer 1

您尚未定义id参数。

更改

function toggleMenu(){

到

function toggleMenu(id){

Answer 2

目前，您的toggleMenu函数不带任何参数。您的html也在脚本标记内

<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>

使用纯JavaScript切换

2 个答案: