2

我有一个 div 在鼠标离开该区域后 5 秒自动隐藏。如果 div 中的任何元素具有键盘焦点并在用户退出时重新启用,我想防止这种隐藏。这是我的代码

delayedRollUp = function() {
    if ( !$metaArea.hasClass('active') ) {
        var timeout = setTimeout(function(){
            animateRollUp( $metaTab );
        }, 5000 );
        $metaArea.data('timeout', timeout);
    }
};

// Make the meta boxes dissapear on mouse leave
$metaArea.mouseenter( function(){
    clearTimeout($(this).data('timeout'));
}).mouseleave(function(){
    delayedRollUp();
}).focusin( function(){
    $metaArea.addClass('active');
}).focusout(function(){
    $metaArea.removeClass('active');
});

我可以看到问题是鼠标和键盘事件都没有相互考虑。我需要一个条件检查,类似于hasMouseFocusandhasKeyboardFocus这样我可以防止setTimeout()被调用,但我找不到像文档中那样的任何方法。

更新了代码以将活动类添加到$metaArea. 这部分地起作用,因为如果单击元素,它不会隐藏,但元素之间的选项卡会导致超时被重置。

我该如何解决这个问题?

4

1 回答 1

2

您可以使用选择器检查输入元素是否具有焦点:focus

// Returns number of elements currently focused inside #container(0 或 1) $('#container input:focus').length

参考

于 2013-09-16T13:45:56.303 回答