菜单应该隐藏在没有超时的情况下

Question

我想要完成的是在单击“按钮”时显示一个菜单（按钮和菜单位于单独的元素中，因此鼠标最初不会悬停在菜单上）。

如果菜单在超时期间没有悬停，则菜单应隐藏自身（目前它会执行此操作，但仅在第一次点击时）。

此外，如果元素被悬停，我想隐藏鼠标输出并清除计时器并再次单击该按钮将重置超时（它可能不会重置？）。

我已经尝试了几个化身，我尝试过的任何事情都表现不正确，我正在寻求建议。这就是我目前使用的：

var mytimer = window.setTimeout(function() {$('.menu-div').slideUp(function() {
        window.clearTimeout(this.mytimer);
})
}, 5000);

$().ready(function(){

    $('#menu-button').click(function () {
        $('.menu-div').slideDown();
        $(mytimer);
    });

    $('.menu-div').mouseenter(function() {
       window.clearTimeout(this.mytimer);
    });

    $('.menu-div').mouseout(function() {
        $('.menu-div').slideUp(200);
    });
});