0

我目前有一个非常简单的 jquery 函数，如果按下菜单，则显示菜单。

$(".menu").on("click", function( event ){
   $(".menulist").css("display","block");
   alert(event);
})

如果再次单击菜单按钮或他们单击菜单，我想再次显示无。

我已经尝试了如下的关闭功能，但后来意识到它无论如何都行不通：

$(".menu").off("click", function(){
   $(".menulist").css("display","none");     
})

关于如何做到这一点的任何建议？如果有帮助，这也适用于移动网站

编辑：该事件在第一个函数中，因为我认为我可以使用此事件来判断该项目是否已经显示。无论是那个还是另一个，我会更好（“click”函数（）来检查.menu的显示的css值是否等于block或none，然后从那里改变css？这将解决点击到菜单按钮但不在菜单外

4

7 回答 7

3 
$(".menu").on("click", function( event ){
   $(".menulist").toggle();
})
于 2013-08-12T13:29:36.917 回答
3

用于$(".menu").on("click", function(){ $('.menulist').toggle() });切换菜单列表的可见性。

更新

要在单击off菜单元素时关闭菜单，只需在 body 标记上捕获 click 事件并在菜单打开时关闭菜单：

整个片段看起来像这样：

$('.menu').on('click', function(){ 
    $('.menulist').toggle();
});

$('body').on('click', function(e){
    if(!$(e.target).hasClass('.menu') && $('.menulist').is(':visible')) {
        $('.menulist').hide();
    }
});
于 2013-08-12T13:29:40.107 回答
1

尝试使用togglejQuery的方法：

$(".menu").on("click", function() {
    $(".menulist").toggle();
});
于 2013-08-12T13:28:28.560 回答
0

就这么简单

$(".menu").on("click", function( event ){
   $(".menulist").toggle();
});
于 2013-08-12T13:29:35.110 回答
0 
$(".menu").on("click", function(){
    var $menulist = $(".menulist");
    $menulist.toggle($menuList.is(":visible"));
}
于 2013-08-12T13:30:06.163 回答
0 
$(".menu").on("click", function( event ){
   if($(".menulist:visible"))
   {
     $(".menulist").css("display","none");
    }else{
     $(".menulist").css("display","block");
   }
});
于 2013-08-12T13:28:49.557 回答
0

由于toggle()功能已弃用：

$(".menu").on("click", function( event ){
   if( $(".menulist").css("display")!="none")
    {
       $(".menulist").css("display","none");
    }
    else{
      $(".menulist").css("display","block");
   }
});
于 2013-08-12T13:37:58.563 回答