jQuery：Firefox焦点事件

问题描述

| 我在一个div中有两个输入框，我想在输入中的focusOut上隐藏该div，但前提是它们两个都没有焦点。 这是Firefox的常见问题（有人称其为标准问题），但文档主体之间却失去了重点。 的HTML

<div id=\"baz\">
   <input type=\"text\" id=\"foo\" name=\"foo\" />
   <input type=\"text\" id=\"bar\" name=\"bar\" />
</div>

jQuery的

// jQuery Example
jQuery(\":input\").focusout(function(){
   // Don\'t do anything if one of the input Boxes has focus
   if( jQuery(\":input\").is( jQuery(document.activeElement) ){ return; }

   // Hide the container if one of the inputs loose focus
   jQuery(this).parents(\"div\").css(\"display\",\"none\");
}

尽管这是一个常见的错误，但我忘记了过去的解决方法。我认为这与检查out2 refresh之前设置超时或刷新屏幕有关。 jsfiddle示例 jsfiddle更新（FF4同样的问题）     

解决方法

        演示版

jQuery(\":input\").focusout(function(){
    var elem = jQuery(this).parent(\"div\");
    window.setTimeout(function(){
            // Don\'t do anything if one of the input boxes has focus
            if( jQuery(\":input\").is( jQuery(document.activeElement) )){ return; }

            // Hide the container if one of the inputs loose focus
            elem.hide();
    },0);
})

演示版

jQuery(document).ready(function () {
    var timeoutID;

    jQuery(\":input\").focus(function () {
        window.clearTimeout(timeoutID);
    }).focusout(function () {
        timeoutID = window.setTimeout(function () {
            jQuery(\"#baz\").hide();
        },0);
    });
});

    ,        我认为amit_g的解决方案就在那里。我隐约记得我通过两种方式进行了此操作： 比较输入与

activeElement

（上面显示的方法） 为相应的事件在元素上设置/清除\“ focus \”类 我认为这两种方法都需要使用

setTimeout

，因为Firefox具有延迟触发，我们需要强制执行。我听说FF在这里遵守标准时，我个人认为该标准需要修改。 因此，除了添加定时函数调用之外，还需要清除其他“ acceptable”元素是否获得关注。以下不是生产代码，但确实显示了它作为示例： 示例解决方案 示例解决方案（甚至更好）-将

$debug

设置为

false

示例解决方案（本地化块）-消除了调试混乱