jquery - 如何使用 Jquery 下拉菜单延迟隐藏菜单？

Question

我有一个工作正常的下拉菜单，但我希望这样，如果我将鼠标悬停在菜单之外，它不会立即再次隐藏。所以基本上我想要一秒钟的延迟。

我已阅读有关 setTimeout 的内容，但不确定它是否是我需要的？

$('#mainnav a').bind('mouseover', function()
{
    $(this).parents('li').children('ul').show();
});

$('#mainnav a').bind('mouseout', function()
{
    $(this).parents('li').children('ul').hide();
});

Answer 1

setTimeout 正是您所需要的。

$('#mainnav a').bind('mouseout', function()
{
    var menu = this;
    setTimeout(function()
    {
        $(menu).parents('li').children('ul').hide();
    }, 1000);
});