为什么$(“a:focus”).length的值为0,除非包装在setTimeout()中?

我正在将键盘导航添加到网站的主菜单中,我希望当用户在主菜单外选项卡时关闭任何打开的子菜单。所以我有以下功能:

var $nav = $(".navigation nav.main"),
    $navItems = $nav.find("a");

$navItems.on("blur", function() {
    if ($nav.find("a:focus").length === 0) {
        closeMenu();
    }
});

我希望这样做的方式是这样的:

1. 当菜单中的任何链接失去焦点时…
2. 如果有 不 菜单中有焦点的链接,关闭菜单

但事实上 $(nav.find("a:focus").length) 总是 评估为 0 ,甚至当我可以直接看到屏幕上确实存在一个与菜单中的焦点有关的链接时。

但是,如果我把 setTimeout() 在有条件的情况下,它的工作方式是我所期望的:

var $nav = $(".navigation nav.main"),
    $navItems = $nav.find("a");

$navItems.on("blur", function() {
    setTimeout(function() {
        if ($nav.find("a:focus").length === 0) {
            closeMenu();
        }
    });
});

现在, $nav.find("a:focus").length 评估到 1 每次我打 标签 ,直到i选项卡位于菜单外部,此时它的计算结果为 零 把它关上。

这正是我想要的工作方式,但为什么 设置TimeTo() 必要吗?