如何解决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
示例解决方案(本地化块)-消除了调试混乱
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。