Question

我有以下菜单设计

<div class="span2 main-menu-span">
    <div class="well nav-collapse sidebar-nav">
        <ul class="nav nav-tabs nav-stacked main-menu">
            <li class="nav-header hidden-tablet"><span id="menu1" style="cursor: pointer; cursor: hand;" onClick=checkMenu('menu1')>-</span> Main 1</li>
            <li id='menu1a'><a class="ajax-link" href="menu1a.php"><span class="hidden-tablet">Menu 1 a</span></a></li>
            <li id='menu1b'><a class="ajax-link" href="menu1b.php"><span class="hidden-tablet">Menu 1 b</span></a></li>
        </ul>
    </div>
</div>

我想要做的是，当用户按下“ - ”符号时，它会将其隐藏，符号变为“+”但是我按下它永远不会显示回来。

function checkMenu(idVal){
   var idValue = idVal;
   //alert("Mwnu value :" +idValue);
   //alert("Mwnu value :" +document.getElementById(idValue).innerHTML);
   if(document.getElementById(idValue).innerHTML=="+"){
      if(idValue == "menu1" ){
        //alert("Mwnu value :" +idValue);
        document.getElementById("menu1a").style.display="block";
        document.getElementById("menu1b").style.display="block";            
        document.getElementById("menu1").innerHTML ="-" ;
      }         
   }
   if(document.getElementById(idValue).innerHTML=="-"){
      if(idValue=="menu1"){             
        //alert("Mwnu value :" +document.getElementById("menu1a").style.display);
        document.getElementById("menu1a").style.display="none";
        document.getElementById("menu1b").style.display="none";
        document.getElementById("menu1").innerHTML ="+" ;
      }         
   }

Answer 1

您需要else if：

else if(document.getElementById(idValue).innerHTML=="-")
{
...

Answer 2

正如你在警告中看到的那样，innerHtml的值有空格，使用trim（），加上其他如果正如JoshJ所说

document.getElementById(idValue).innerHTML.trim()

即：http://plnkr.co/edit/YPE59IR4GKxL4JCilNUz?p=preview

编辑：顺便说一下，除非你想学习这个，否则我建议你使用像bootstrap这样的东西，这些东西已经为你完成了。

设置为无后，显示块不显示

2 个答案: