Question

我用css和jquery

创建了一个多级菜单

我无法将鼠标带到第二级。只要我将鼠标移到第二级，脚本就会隐藏整个菜单。

脚本：

$('#bigmenu').hide();
$('#bigmenu_side').hide();
$('#mydiv').mouseenter(function (e) {
    $('#bigmenu').fadeIn(100);
});
$('#bigmenu').mouseleave(function (e) {
    var inFocus = $("#search_by_profile_id").is(":focus");
    if (!inFocus) {
        $(this).fadeOut(100);
    }
});

$('.bd_hover_change_color').mouseenter(function (e) {
    if (event.target.id == 'bd_menu_register') {
        $('#bigmenu_side').html("option A <br> option B <br> option C");
    }
    $('#bigmenu_side').show();
});
$('.bd_hover_change_color').mouseleave(function (e) {
    $('#bigmenu_side').html("");
    $('#bigmenu_side').hide()
});

Answer 1

这是代码中的逻辑问题。您还必须进行此操作，以便当鼠标悬停在bigmenu_side上时菜单不会淡出。为此，请将bigmenu_side的类设置为bd_hover_change_color，以使其满足$('.bd_hover_change_color').mouseenter函数的要求。

试试这个更新的小提琴：http://jsfiddle.net/YhgBw/24/

更新：我之前的小提琴链接的一些问题，搜索和文本字段无法正常运行，再次更新它以获得功能齐全的菜单。

jquery中的多级菜单

1 个答案: