Question

我制作了一个剧本。这在导航中打开了我的子菜单。当你将鼠标移出子菜单时。子菜单必须以300毫秒的延迟关闭。但是延迟没有奏效。我怎样才能解决这个问题？这是我的剧本：

$('.nav-main .container li').hover(function() {
    if ($(this).find('.submenu').length > 0) {
        $(this).addClass("hover");
        $(this).find('.submenu').show();
    }
}, function() {
    $(this).find('.submenu').delay(300).hide();
    $(this).removeClass("hover");
});

Answer 1

我没有测试过以下代码，但它应该有用......

$('.nav-main .container li').hover(function() {
    if ($(this).find('.submenu').length > 0) {
        $(this).addClass("hover");
        $(this).find('.submenu').show();
    }
}, function() {
    var submenu = $(this).find('.submenu');
    setTimeout(function() {
      submenu.hide();
    }, 300);
    $(this).removeClass("hover");
});

Answer 2

您需要创建一个setTimeout（）方法，同样，您需要定义一个在函数内部使用的对象$（this）将为null。

$('.nav-main .container li').hover(function() {
    if ($(this).find('.submenu').length > 0) {
        $(this).addClass("hover");
        $(this).find('.submenu').show();
    }
}, function() {
    var object = $(this);
    setTimeout(function()
    {
        $(object).find('.submenu').hide();
        $(object).removeClass("hover");
    }, 300);
});

延迟子菜单

2 个答案: