Question

我需要自定义一个仅在悬停时打开的大型菜单（display：none / display：block）。

我需要它也可以点击，所以我添加了这个

     $(".menuitem_fullwidth").click(function(){
        $(this).find(".dropdown_fullwidth").css( "display", "block" );

           return false;
        });

但现在它会在点击时打开，但是当我点击其他菜单项时没有任何反应

只有第一个菜单（第一次点击）始终保持打开状态且未关闭或更改为其他项目

Answer 1

首先需要关闭所有菜单，然后打开点击的菜单

 $(".menuitem_fullwidth").click(function(){
        $(".dropdown_fullwidth").css( "display", "none" );
        $(this).find(".dropdown_fullwidth").css( "display", "block" );

           return false;
        });

Answer 2

试一试

 $(".menuitem_fullwidth").click(function(){
    $(".dropdown_fullwidth").css({display: "none"});
    $(this).find(".dropdown_fullwidth").css( "display", "block" );
 });

Answer 3

获取您已有的悬停代码，然后将click事件添加到其中。您可以将多个事件绑定到同一代码

$('#element').on('hover click', function() {
  // code here..
});

Answer 4

我假设你一次尝试打开一个菜单，你可以使用切换，

$(document).on('click','.menuitem_fullwidth'(function(){
        $('.dropdown_fullwidth').toggle();
        $(this).find(".dropdown_fullwidth").toggle();
           return false;
        });

添加点击鼠标悬停事件

4 个答案: