如何在div失去焦点后运行一个函数？

我有几个divs ，每个divs包含一个form 。 每个表单都有两个input text fields 。 我试图在div looses focus后trigger一个function （意思是，不是在其中一个输入文本字段失去焦点之后，而是在新div中的全新forms获得焦点之后）。

 
 
 
 
 
 send 
 
 
 
 
 
 send 
 
 
 
 
 
 send 
 
  

这里是jquery代码：

 $('#userInputID').children().blur(function(){ //some code })//end blur 

基本上，我希望函数在具有类col1，colx或col2的任何div失去焦点时运行。 上面的jquery代码甚至都没有触发。 Focusout不起作用，因为在每个输入文本字段松散焦点后触发，即使相同的div仍具有焦点。

Answer 1

.blur()文档会让您相信您可以这样使用它; 但是，我相信你必须在一个不是有效表单元素的元素上明确触发模糊（例如输入，选择等）;

看到这个小提琴： http ： //jsfiddle.net/z7VYQ/

根据您对validation的评论， 这个小提示将向您展示如何确定当前关注的表单，并对其他表单进行调整。

Answer 2

如何在div失去焦点后触发一个function（模糊）

基于测试并在这些页面1,2上看起来模糊不会冒泡。 但您可以使用解决方法。 这个更新的小提琴表明它根据我对你的问题的理解而工作：

• 对于div id='userInputID'的子id='userInputID'每个div
• 创建一个事件监听器，在div失去焦点后触发（模糊）

如果on()使用jQuery函数on()可以捕获焦点和模糊事件。

 $(document).ready(function() { $( "#userInputID" ).on( "blur", "div.onBlurTest", function() { $( this ).toggleClass( "hasFocus" ); $( this ).addClass( "hasLostFocus" ); $( this ).children("h2").text("Using on instead of blur"); }); }); 

和HTML

 
 
 
Using on instead of blur
 
  
  
 send 
 
  

在2013年12月更新的小提琴完全工作的演示

正如Chris Rockwell指出的那样，如果使用tab键， 我的前小提琴演示不起作用。 我创建了一个与tab键一起使用的fork

 $(document).ready(function() { // Handler for .ready() called. $( "#userInputID" ).on( "focus", "div.onBlurTest", function() { $( this ).toggleClass( "hasFocus" ); $( this ).removeClass( "hasLostFocus" ); }); $( "#userInputID" ).on( "blur", "div.onBlurTest", function() { $( this ).toggleClass( "hasFocus" ); $( this ).removeClass( "hasLostFocus" ); }); }); 

并简化了HTML

如果您有其他问题，请告诉我。

一些报价

从jQuery Api上模糊

blur事件在Internet Explorer中不会出现气泡。 因此，依赖于使用blur事件的事件委派的脚本将无法在浏览器中一致地工作。 但是，从版本1.4.2 ，jQuery通过将blur映射到其事件委托方法（ .live()和.delegate()的focusout事件来解决此限制。