小开

您是否考虑过使用鼠标移至和mouseOut来模拟这种情况。另外，还要看看mouseEnter和mouseLeave

小开

跟踪这两个状态(悬停，聚焦)作为真/假标志，当其中一个发生变化时，运行一个函数，如果两者都为假，则删除边界，否则显示边界。

onfocus sets focused = true, onblur sets focused = false。Onmouseover sets hovers = true, onmouseout sets hovers = false。在每个事件之后运行一个添加/删除边框的函数。

小开

据我所知，你不能问浏览器屏幕上的任何输入是否有焦点，你必须设置某种焦点跟踪。

我通常有一个名为“noFocus”的变量，并将其设置为true。然后我添加一个焦点事件到所有输入，使noFocus为假。然后我添加了一个模糊事件的所有输入，设置noFocus回真。

我有一个MooTools类可以很容易地处理这个问题，我相信你可以创建一个jquery插件来做同样的事情。

一旦创建，你可以在做任何边界交换之前检查noFocus。

小开

我不完全确定你在追求什么，但这听起来像它可以通过存储输入元素的状态(或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;
});
});

小开

没有:focus，但有:selected # EYZ0 < / p >

但是如果你想要根据所选择的内容来改变事物的外观，你可能应该使用模糊事件。

http://docs.jquery.com/Events/blur

小开

我所做的是创建一个名为.elementhasfocus的任意类，它在jQuery focus()函数中添加和删除。当hover()函数在鼠标离开时运行，它会检查.elementhasfocus:

if(!$("#quotebox").is(".boxhasfocus")) $(this).removeClass("box_border");

因此，如果它没有这个类(阅读:没有元素在div有焦点)边界被删除。否则，什么都不会发生。

小开

CSS:

.focus {
border-color:red;
}

JQuery:

  $(document).ready(function() {


$('input').blur(function() {
$('input').removeClass("focus");
})
.focus(function() {
$(this).addClass("focus")
});
});

小开

使用类来标记元素状态的替代方法是内部的数据存储功能。

附注:您可以使用data()函数存储布尔值和任何您想要的值。这不仅仅是关于字符串:)

$("...").mouseover(function ()
{
// store state on element
}).mouseout(function ()
{
// remove stored state on element
});

然后就是访问元素状态的问题了。

小开

有一个插件可以检查一个元素是否被聚焦:http://plugins.jquery.com/project/focused

$('input').each(function(){
if ($(this) == $.focused()) {
$(this).addClass('focused');
}
})

小开

最佳答案

jQuery 1.6 +

jQuery添加了:focus选择器，所以我们不再需要自己添加它。使用$("..").is(":focus")即可

jQuery 1.5及以下版本

随着时代的变化，我们找到了更好的方法来测试焦点，最受欢迎的是这是本·阿尔曼的要点:

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

引自Mathias Bynens 在这里:

注意，添加(elem.type || elem.href)测试是为了过滤掉像身体这样的假阳性。这样，我们可以确保过滤掉除了表单控件和超链接之外的所有元素。

您正在定义一个新的选择器。看到# EYZ0。然后你可以这样做:

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

或者:

$("input:focus").doStuff();

任何jQuery

如果你只想知道哪个元素有焦点，你可以使用

$(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 );

小开

这里有一个比目前公认的更有力的答案:

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

注意，添加(elem.type || elem.href)测试是为了过滤掉像body这样的假阳性。这样，我们可以确保过滤掉除了表单控件和超链接之外的所有元素。

(从这个要点到本Alman)

小开

我设置了一个.live(“focus”)事件来选择()(突出显示)文本输入的内容，这样用户就不必在输入新值之前选择它。

$ (formObj) .select ();

由于不同浏览器之间的奇怪之处，选择有时会被引起它的点击所取代，它会取消选择内容后，将光标放置在文本字段中(在FF中工作得很好，但在IE中失败)

我想我可以通过稍微延迟选择来解决这个问题…

setTimeout(函数(){$ (formObj) .select ();}, 200);

这工作得很好，选择将持续存在，但一个有趣的问题出现了。如果您从一个字段切换到下一个字段，那么在选择发生之前，焦点将切换到下一个字段。由于select窃取焦点，焦点将返回并触发一个新的“焦点”事件。这最终导致输入选择在屏幕上跳来跳去。

一个可行的解决方案是在执行select()之前检查字段是否仍然有焦点，但如前所述，没有简单的方法来检查…我最终只是放弃了整个自动高亮，而不是把应该是一个jQuery select()调用变成一个包含子例程的巨大函数……

小开

简单的

 <input type="text" />






<script>
$("input").focusin(function() {


alert("I am in Focus");


});
</script>

小开

如果有人关心的话，现在有一个更好的方法来捕捉焦点，$(foo).focus(...)

http://api.jquery.com/focus/

小开

2015年4月更新

由于这个问题已经出现了一段时间，并且已经出现了一些新的约定，我觉得我应该提到.live方法已经被贬低了。

现在引入了.on方法。

他们的文档在解释它是如何工作方面非常有用;

.on()方法将事件处理程序附加到当前选择的集合 jQuery对象中的元素。从jQuery 1.7开始，.on()方法提供附加事件处理程序所需的所有功能。为帮助从旧的jQuery事件方法转换，参见.bind()， .delegate()和.live().

因此，为了让你瞄准“input focused”事件，你可以在脚本中使用它。喜欢的东西:

$('input').on("focus", function(){
//do some stuff
});

这是相当强大的，甚至允许您使用TAB键以及。

使用jQuery测试输入是否有焦点

jQuery 1.6 +

jQuery 1.5及以下版本

任何jQuery

2015年4月更新