如何检查一个DOM元素是否可聚焦？

Question

许多DOM元素是可聚焦的：具有tabIndex属性的div元素，input元素等。是否有一种简单的方法来检查元素是否可聚焦，而不是检查无数不同情况？是否有jQuery方法可以实现此功能？

- Konstantin Solomatov

---

这个有帮助吗？https://dev59.com/jnNA5IYBdhLWcg3wbNM4#2684561 - Hashem Qolami

@HashemQolami，那不是他所要求的。 - gustavohenke

我并没有说那是这样的！我只是问了一个问题。 - Hashem Qolami

为什么这个问题被认为是重复的？！原帖作者并不关心页面上所有可聚焦元素，而这正是顶部链接回答的问题。原帖作者只是想知道一个给定的DOM元素是否可以接收焦点。两个问题非常不同。 - Tejasvi Karne

Answer 1

以下内容是从此处翻译而来：哪些HTML元素可以获得焦点？

• <a> 或者 <area> 并且具有 href
• 任何未被禁用的表单元素
• iframe 元素
• 任何具有 tabindex 属性的元素

此外，我认为隐藏的元素也不能获得焦点。

假设满足上述条件，下面的函数可能会帮到你（假定它总是接收一个 jQuery 元素）：

function canFocus( $el ) {
    if ( $el.is( ":hidden" ) || $el.is( ":disabled" ) ) {
        return false;
    }

    var tabIndex = +$el.attr( "tabindex" );
    tabIndex = isNaN( tabIndex ) ? -1 : tabIndex;
    return $el.is( ":input, a[href], area[href], iframe" ) || tabIndex > -1;
}

- gustavohenke

---

我知道哪些项目可以接收焦点。然而，我想要一些经过验证的解决方案，以涵盖我可能不知道的所有情况。 - Konstantin Solomatov

请检查更新后的答案是否对您有所帮助。 - gustavohenke

jQuery内置了这个功能，只需要使用$el.is(':focusable')即可。参考链接：http://api.jqueryui.com/focusable-selector/ - lazd

这段话来自于jQuery UI，不是 jQuery核心。所以为什么要给我点踩呢？你能解释一下吗？ - gustavohenke

在MacOS上，Firefox中的锚点默认情况下并不总是可聚焦的。我的意思是你可以通过编程方式将焦点放在它们上面，但不能使用Tab键。 - Anton Kononenko