On the front page of a site I am building, several <div>s use the CSS :hover pseudo-class to add a border when the mouse is over them. One of the <div>s contains a <form> which, using jQuery, will keep the border if an input within it has focus. This works perfectly except that IE6 does not support :hover on any elements other than <a>s. So, for this browser only we are using jQuery to mimic CSS :hover using the $(#element).hover() method. The only problem is, now that jQuery handles both the form focus() and hover(), when an input has focus then the user moves the mouse in and out, the border goes away.

我在想我们可以用一些条件来阻止这种行为。例如,如果我们在鼠标移出时测试任何输入是否有焦点,我们可以阻止边界消失。AFAIK,在jQuery中没有: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键以及。

其他回答

您是否考虑过使用mouseOver和mouseOut来模拟这种情况。还可以查看mouseEnter和mouseLeave

简单的

 <input type="text" /> 



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

    alert("I am in Focus");

     });
 </script>

2015年4月更新

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

现在引入了.on方法。

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

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

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

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

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

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

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

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

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