之一内的输入获得焦点时,由 .hover() 方法创建的边框会在鼠标移开时消失。
为了解决此问题,我们试图确定是否有任何输入获得焦点鼠标移出。由于 jQuery 缺少 :focus 选择器,因此需要替代方法。
jQuery 1.6 及以上
jQuery 1.6 包含一个 :focus 选择器,无需自定义实现。只需使用 $("..").is(":focus") 来检查聚焦输入。
jQuery 1.5 及以下
对于早期的 jQuery 版本,建议定义一个自定义 :focus 选择器。这可以通过以下方式实现:
jQuery.expr[':'].focus = function( elem ) {
return elem === document.activeElement && ( elem.type || elem.href );
};
登录后复制
这确保只有表单控件和超链接被视为焦点。
或者,您可以使用:
if ($("...").is(":focus")) { ... }
登录后复制
或:
$("input:focus").doStuff();
登录后复制
所有 jQuery版本
要确定哪个元素具有焦点,无论 jQuery 版本如何,请使用:
$(document.activeElement)
登录后复制
检查是否缺少 :focus 选择器
如果您不确定 jQuery 版本,可以添加 :focus 选择器手动:
(function ( $ ) {
var filters = $.expr[":"];
if ( !filters.focus ) {
filters.focus = function( elem ) {
return elem === document.activeElement && ( elem.type || elem.href );
};
}
})( jQuery );
登录后复制
通过采用这些技术,您可以保持所需的边框行为,同时适应浏览器特定的限制。