Question

我有如下菜单结构：

<ul class="sub-menu" style="display: none;">
<li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-1564 current_page_item menu-item-5230" id="menu-item-5230"><a href="http://artofsujatha.wpstag.sirahu.net/curriculam-vitae/" title="Curriculam VItae">Curriculam VItae</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5231" id="menu-item-5231"><a href="http://artofsujatha.wpstag.sirahu.net/bio/" title="Bio">Bio</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5232" id="menu-item-5232"><a href="http://artofsujatha.wpstag.sirahu.net/artist-statement/" title="Artist Statement">Artist Statement</a></li>
</ul>

当我点击UL中的任何LI元素时，我需要将类“active”添加到UL元素。我怎么能在jQuery中做到这一点？

Answer 1

试试这个：

$('ul.sub-menu li').click(function(){
 $(this).parent().addClass('active');
});

Answer 2

$('li.menu-item').click(function () {
    $(this).parent('ul').addClass('active');
});

根据您对页面刷新的评论，以下是一个应该有效的解决方案：

$(function() {
    $('li.current-menu-item').parent('ul').addClass('active');
});

Answer 3

将LI的onclick事件设置为： -

$(this).parent().attr('class', 'active');

Answer 4

$('li').click(function() {
  $(this).parent().addClass('active');
});

Answer 5

试试这个

$(document).ready(function(){
    $("li.current-menu-item").parent().addClass("active");
});

Answer 6

也许是这样的？

$(function() {
    function updateMenu() {
        $('ul.sub-menu.active').removeClass('active');
        $('li.current-menu-item').parent('ul.sub-menu').addClass('active');
    }

    $('li.menu-item').click(function(e) {
        // prevent page from redirect
        e.preventDefault();

        // set new current-menu-item
        $(this).siblings().removeClass('current-menu-item');
        $(this).addClass('current-menu-item');

        // and update active menu according the current-menu-item
        updateMenu();
    });

    updateMenu();
});

Answer 7

我用这个。它有效。

<script>
         $(document).ready(function(){
       $('ul.sub-menu li').each(function (){
    var linktext = $(this).attr('class');
   if( $("linktext:contains('current-menu-item')") ) {
       $(this).parent('ul').addClass('current');
    }
});
});
     </script>

如何在单击子项时使用jQuery将类添加到父元素？

7 个答案: