jQuery 中如何确定输入元素是否获得焦点？

如何使用 jQuery 确定输入是否聚焦

在网站的首页中，多个

元素使用 CSS :hover 伪类在鼠标悬停在元素上时显示边框。其中一个

是元素包含一个

在 jQuery 的帮助下，当任何输入元素获得焦点时，它都会保持边框。

此设置工作完美，但在 IE6 中除外，IE6 不支持 :hover 在 以外的元素上。标签。为了解决这个问题，使用 jQuery 来模仿 CSS :hover 使用 $(#element).hover() 方法。

但是，当 jQuery 同时处理表单的 focus() 和 hover() 时，就会出现问题。当输入元素获得焦点并且用户将鼠标移入和移出时，边框会消失。

要解决此问题，请考虑使用条件语句。例如，通过检查是否有任何输入聚焦于鼠标移出事件，可以防止边框消失。由于 jQuery 缺少 :focus 选择器，因此需要探索替代方法。

jQuery 1.6

jQuery 1.6 引入了 :focus 选择器，消除了自定义实现的需要。只需使用：

$("..").is(":focus")

jQuery 1.5 及以下

已经出现了用于测试焦点的新方法，包括 Ben Alman 的实现：

jQuery.expr[':'].focus = function( elem ) {
  return elem === document.activeElement && ( elem.type || elem.href );
};

这定义了一个自定义选择器，允许使用例如：

if ($("...").is(":focus")) {
  ...
}

任何 jQuery 版本

用于检索当前聚焦的元素：

$(document.activeElement)

确保与 jQuery 版本 1.6 兼容及以下：

(function ( $ ) {
    var filters = $.expr[":"];
    if ( !filters.focus ) { 
        filters.focus = function( elem ) {
           return elem === document.activeElement && ( elem.type || elem.href );
        };
    }
})( jQuery );

以上是jQuery 中如何确定输入元素是否获得焦点？的详细内容。更多信息请关注PHP中文网其他相关文章！