Question

我不是最好的jquery，我需要一些帮助我遇到的问题......

我有这个脚本：

<script>
            jQuery('.go_menu_tier').click(function(){
                var id = jQuery(this).attr('data-id');

                if(jQuery('.menu-'+id).is(":visible")){ 
                    jQuery('.menu-'+id).slideUp();  
                    jQuery(this).removeClass('activemenu'); 

                }else{
                    jQuery('.menu-tier-2').hide();
                    jQuery('.menu-'+id).slideDown();
                    jQuery(this).addClass('activemenu');

                }

                return false;
            });
        </script>

与此css一起：

.go_menu_tier:after{
    content: "+";
 display: inline-block;
    margin-left: 5px;
    width: 10px;
}
.activemenu:after {
    content: "-";
 display: inline-block;
    margin-left: 5px;
    width: 10px;
}

基本上有一个自定义wordpress菜单，其中包含一些带有下拉菜单的菜单项。我已经正确设置了除了当我点击一个下拉列表和另一个下拉列表时它没有苹果风格显示+而不是 - 符号。如果我单击主菜单项以滑动子菜单然后再次单击它css内容正确切换+和 - 。只有当一个子菜单打开并且我点击另一个顶部菜单项时，之前打开的顶部菜单项不会切换回+而不是 - 符号......

这是HTML：

<div class="menu-tier-2 menu-8463"><ul><li><a href="/collections/t-shirt" target="">Tees</a></li><li><a href="/collections/shirts-tops" target="">Tops</a></li><li><a href="/collections/pants" target="">Pants</a></li><li><a href="/collections/hats" target="">Hats</a></li><li><a href="/collections/walkshorts" target="">Walkshorts</a></li><li><a href="/collections/boardshorts" target="">Boardshorts</a></li><li><a href="/collections/accessories" target="">Accessories</a></li><li><a href="/collections/jackets" target="">Jackets</a></li></ul><div style="clear: both;"></div></div><div class="menu-tier-2 menu-8477"><ul><li><a href="/rl14/about/" target="">About</a></li><li><a href="/rl14/fall-2014-look-book/" target="">Look Books</a></li><li><a href="/rl14/imalive/" target="">IM Alive</a></li><li><a href="#" target="">Instagram</a></li></ul><div style="clear: both;"></div></div><div class="menu-tier-2 menu-8481"><ul><li><a href="/rl14/contact/" target="">Contact</a></li><li><a href="/rl14/dealer-select/" target="">Dealers</a></li></ul><div style="clear: both;"></div></div>

Answer 1

您需要从之前有效的菜单中删除activemenu类：

            if(jQuery('.menu-'+id).is(":visible")){ 
                jQuery('.menu-'+id).slideUp();  
                jQuery(this).removeClass('activemenu'); 

            }else{
                jQuery('.menu-tier-2').hide();
                jQuery('.menu-'+id).slideDown();
                jQuery('.activemenu').removeClass('activemenu');
                jQuery(this).addClass('activemenu');

            }

removeClass无法处理.hide或.slideup

1 个答案: