Question

如果父菜单下有子菜单，我在wordpress上使用的主题之一就是使用切换菜单。

这是当前的js代码

    var navItemDropdown = $('#nav li .dropdown');
navItemDropdown.each(function(){
    thisDropdown = $(this);
    $(this).parent().prepend('<span class="sub-nav-toggle"></span>');
});

$('body').on('click','.sub-nav-toggle',function(event){

    $(this).parents('li').toggleClass('active');
    thisDropdown = $(this).parents('li').find('.dropdown');
    thisDropdown.slideToggle('fast');
    return false;

});

如果有子菜单，则添加<span class="sub-nav-toggle"></span>。

具有子菜单的菜单代码变得像这样

    <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-22"><span class="sub-nav-toggle"></span><a href="#">About Us</a>
<section class="dropdown"><ul>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-26"><a href="page_id=6">Who we are</a></li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-25"><a href="page_id=7">Our Vision</a></li>
</ul></section>
</li>

我想要实现的是不是注入<span class="sub-nav-toggle"></span>，而是想在a href标记内插入class =“sub-nav-toggle”。这意味着<a>代码将变为这样

<a class="sub-nav-toggle" href="#">About Us</a>

有一种方法可以通过Wordpress菜单为菜单添加类，但它只在<li>标记而不是<a>标记内添加了类，所以它不起作用，不能这样做。

请帮帮我。谢谢。

Answer 1

我认为你需要改变这个：

$(this).parent().prepend('<span class="sub-nav-toggle"></span>');

到此：

$(this).prev().addClass('sub-nav-toggle');

使用javascript切换菜单

1 个答案: