在我正在构建的站点的首页上，有几个<div>使用 CSS:hover伪类在鼠标悬停在它们上方时添加边框。其中一个<div>s 包含 a <form>，如果其中的输入具有焦点，则使用 jQuery 将保留边框。除了 IE6 不支持s:hover以外<a>的任何元素，这完美地工作。所以，对于这个浏览器，我们只使用 jQuery 来模拟 CSS:hover使用该$(#element).hover()方法。唯一的问题是，现在 jQuery 处理表单focus() 和 hover()，当输入具有焦点时，用户将鼠标移入移出，边框消失。
我在想我们可以使用某种条件来阻止这种行为。例如，如果我们测试鼠标移出是否有任何输入具有焦点，我们可以阻止边框消失。AFAIK，:focusjQuery 中没有选择器，所以我不确定如何实现。有任何想法吗？
jQuery 添加了一个:focus选择器，所以我们不再需要自己添加它。只需使用$("..").is(":focus")
编辑：随着时代的变化，我们找到了更好的测试焦点方法，新的最爱是Ben Alman 的这个要点：
jQuery.expr[':'].focus = function( elem ) {
return elem === document.activeElement && ( elem.type || elem.href );
};
引自 Mathias Bynens在这里：
请注意，
(elem.type || elem.href)添加测试是为了过滤掉像 body 这样的误报。这样，我们确保过滤掉除表单控件和超链接之外的所有元素。
您正在定义一个新的选择器。请参阅插件/创作。然后你可以这样做：
if ($("...").is(":focus")) {
...
}
或者：
$("input:focus").doStuff();
如果你只想找出哪个元素有焦点，你可以使用
$(document.activeElement)
如果您不确定版本是否为 1.6 或更低，您可以添加:focus缺少的选择器：
(function ( $ ) {
var filters = $.expr[":"];
if ( !filters.focus ) {
filters.focus = function( elem ) {
return elem === document.activeElement && ( elem.type || elem.href );
};
}
})( jQuery );
CSS：
.focus {
border-color:red;
}
查询：
$(document).ready(function() {
$('input').blur(function() {
$('input').removeClass("focus");
})
.focus(function() {
$(this).addClass("focus")
});
});
由于这个问题已经存在了一段时间，并且一些新的约定开始发挥作用，我觉得我应该提到该.live方法已被贬值。
取而代之的是，.on现在已经引入了该方法。
他们的文档对于解释它的工作原理非常有用；
.on() 方法将事件处理程序附加到 jQuery 对象中当前选定的一组元素。从 jQuery 1.7 开始， .on() 方法提供了附加事件处理程序所需的所有功能。有关从旧 jQuery 事件方法转换的帮助，请参阅 .bind()、.delegate() 和 .live()。
因此，为了让您针对“输入焦点”事件，您可以在脚本中使用它。就像是：
$('input').on("focus", function(){
//do some stuff
});
这非常强大，甚至还允许您使用 TAB 键。
我不完全确定你在追求什么，但这听起来可以通过将输入元素（或 div？）的状态存储为变量来实现：
$('div').each(function(){
var childInputHasFocus = false;
$(this).hover(function(){
if (childInputHasFocus) {
// do something
} else { }
}, function() {
if (childInputHasFocus) {
// do something
} else { }
});
$('input', this)
.focus(function(){
childInputHasFocus = true;
})
.blur(function(){
childInputHasFocus = false;
});
});