0

我正在处理这个小菜单：http: //jsfiddle.net/6a3eZ/25/

问题在于滑动打开的“MISC”和“MISC2”菜单。当一个打开时，另一个需要关闭，并且我在下面粘贴的“切换”代码对于前两次单击工作正常，但随后菜单项将不需要一次而是两次单击才能再次激活。任何关于如何通过单击使其继续运行的线索？

出于某种原因，在触摸设备上也无法关闭菜单。

该代码在任何地方都可以使用“悬停”，但它确实需要单击激活。

这是我所拥有的：

function mainmenu(){

    $('.menu ul').css({display: "none"});

    $('.menu li.sub').toggle(function(){
        $(this).siblings('li').find('ul').slideUp(200);
        $(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(200);
    },function(){
        $(this).find('ul:first').slideUp(200);
    });

    $('.sub-menu li a').click(function(e) {
        e.stopPropagation();
    }); 

};

$(document).ready(function(){                  
    mainmenu();
});
4

2 回答 2

2

试试这个。应该可以正常工作：http: //jsfiddle.net/Ptz9F/

我会说，使用一些类并以正确的方式指定步骤:)

只有我的 jQuery：

$(document).ready(function(){                  
    $('.menu ul.sub-menu').css({display: "none"});
    $('.menu li.sub > a').click(function(e){
        var $this = $(this),
            $parent = $this.parent('li'),
            $sub = $('.sub-menu', $parent);

        if (!$sub.hasClass('slided-down'))
        {
            // this sub is not visible
            $('.sub-menu.slided-down').slideUp(200).removeClass('slided-down');
            $sub.slideDown(200).addClass('slided-down');
        }
        else
        {
            // this sub is visible
            $sub.slideUp(200).removeClass('slided-down');
        }

        e.preventDefault();
        return false;
    });
});
于 2013-05-20T23:15:04.917 回答
1

未经测试，但尝试更像这样的东西：

$(document).ready(function(){                  
    $('.menu ul').hide();

    $('.menu li.sub').click(function() {
        $(this).find('ul:first').slideToggle(200)
               .end().siblings('li').find('ul').slideUp(200);
    });
});
于 2013-05-20T22:41:04.047 回答