如何在html中使用Javascript在ul裏div設置活動類？

我有一個導航菜單項，其中有ul li元素，我想在點擊導航欄時更改我的li類的顏色等。我已經爲此寫下了一些javascript，但它只打開導航菜單項，但是當我點擊子項時頂部菜單項會關閉，並且li項不能設置爲活動狀態。這裏是我此Javascript：如何在html中使用Javascript在ul裏div設置活動類？

<script type="text/javascript"> 
      $(document).ready(function() { 
       $('#moduleNav .locked').tooltip(); 
       $('#moduleNav').on('hide', function() { 
        $(this).find('.accordion-group').each(function() { 
         $(this).removeClass('open'); 
        }); 
       }); 
       $('#moduleNav').on('show', function (e) { 
        $(e.target).siblings('.accordion-group').addClass('open'); 
       }); 
       $('#moduleNav').on('show', function (e) { 
        $(e.target).siblings('.accordion-inner').addClass('li.active'); 
       }); 
      }); 
    </script>

這裏是這個網站：

<div class="accordion-group "> 
<a class="accordion-toggle " data-toggle="collapse" data-target="#submenuitem" data-parent="#moduleNav" href="javascript:void(0);">Open menu item</a> 
       </div> 
<div id="submenuitem" class="accordion-body collapse "> 
<div class="accordion-inner"> 
<ul> 
<li class=""> 
<a href="#">sub item 1</a> 
</li> 
<li class=""> 
<a href="#">sub item 2</a> 
</li> 
</ul> 
</div>

這裏是CSS：

#moduleNav .accordion-group .accordion-inner ul li { 
    border-bottom: 1px solid #3ab553; 
    padding: 10px 6px; 
    position: relative; 
} 

    #moduleNav .accordion-group .accordion-inner ul li.active { 
     background: #d6efd3; 
    } 

     #moduleNav .accordion-group .accordion-inner ul li.active:after { 
      left: 100%; 
      top: 50%; 
      border: solid transparent; 
      content: " "; 
      height: 0; 
      width: 0; 
      position: absolute; 
      pointer-events: none; 
      border-left-color: #d6efd3; 
      border-width: 10px; 
      margin-top: -10px; 
     }

來源

2014-11-04 Ammar Asjad

'addClass（'li.active'）'應該是'addClass（'active'）'。一個複製其他問題的演示將有助於 – charlietfl 2014-11-04 22:41:48

是的，查理說了什麼，'active'被刪除了嗎？ – 2014-11-04 23:21:06

例

CSS：

.active{ 
    background:#00c189l; 
} 
.inactive{ 
    background:gray; 
}

HTML： DIV ID = 「示例」類= 「無效」的onclick = 「更改（）;」>實施例/格

JAVASCRIPT：使用jQuery：

function Change(){ 

    $('#example').removeClass("inactive"); 
    $('#example').addClass("active"); 
}

http://jquery.com/download/

如果您將標記作爲正確答案，請！

來源

2014-11-04 23:39:49 Luis

如何在html中使用Javascript在ul裏div設置活動類？

回答

相關問題