IE6下focus与blur错乱的解决方案


Posted in Javascript onJuly 31, 2011
<body> 
<textarea></textarea> 
hello 
<script> 
window.onblur=function(){ 
document.title= 'blur:' + Math.random() ; 
} 
window.onfocus=function(){ 
document.title= 'focus:' + Math.random() ; 
} 
</script> 
</body>

这应该是一个很常见的需求,例如,当前窗口定期更新数据,而窗口失焦则减少信息更新频率。IE6的bug导致的配对混乱却会打乱我们的计划。
上网查也没查出关于这个bug的官方说明与推荐解决方案,只好自己生更的实现一个解决方案。
代码如下:
<body> 
<textarea></textarea> 
hello 
<script> 
(function(){ 
var focusTimer = 0; 
function myBlur(){ 
document.title= 'blur:' + Math.random() ; 
} 
function myFocus(){ 
clearTimeout(focusTimer); 
focusTimer = setTimeout(function(){ 
document.title = 'focus:' + Math.random() ; 
},10); 
} 
window.onfocus = document.body.onfocusin = myFocus; 
window.onblur = document.body.onfocusout = myBlur; 
}()); 
</script> 
</body>

大略原理是:找到很多可能触发onfocus与onblur的时机,所有的onblur都立即执行,而onfocus则延时10毫秒懒惰执行。
结果是:虽说有时多执行了几次myFocus与myBlur,但能保证窗口状态的正确性。
方法可能有点山寨,不过一时没想到更好的办法,这样也暂时能解个燃眉之急。
Javascript 相关文章推荐
js绑定事件this指向发生改变的问题解决方法
Apr 23 Javascript
jQuery formValidator表单验证
Jan 07 Javascript
js HTML5多图片上传及预览实例解析(不含前端的文件分割)
Aug 26 Javascript
基于AngularJS前端云组件最佳实践
Oct 20 Javascript
jQuery图片轮播实现并封装(一)
Dec 03 Javascript
详解Bootstrap各式各样的按钮(推荐)
Dec 13 Javascript
Angularjs通过指令监听ng-repeat渲染完成后执行脚本的方法
Dec 31 Javascript
jquery实现图片平滑滚动详解
Mar 22 jQuery
JS模拟超市简易收银台小程序代码解析
Aug 18 Javascript
Vue项目中添加锁屏功能实现思路
Jun 29 Javascript
微信小程序开发摇一摇功能
Nov 22 Javascript
详细分析vue响应式原理
Jun 22 Javascript
EXTJS记事本 当CompositeField遇上RowEditor
Jul 31 #Javascript
Javascript 类、命名空间、代码组织代码
Jul 31 #Javascript
仅img元素创建后不添加到文档中会执行onload事件的解决方法
Jul 31 #Javascript
IE6/7 and IE8/9/10(IE7模式)依次隐藏具有absolute或relative的父元素和子元素后再显示父元素
Jul 31 #Javascript
读jQuery之十二 删除事件核心方法
Jul 31 #Javascript
读jQuery之十一 添加事件核心方法
Jul 31 #Javascript
仅Firefox中链接A无法实现模拟点击以触发其默认行为
Jul 31 #Javascript
You might like
PHP实现采集程序原理和简单示例代码
2007/03/18 PHP
php daodb插入、更新与删除数据
2009/03/19 PHP
PHP进阶学习之类的自动加载机制原理分析
2019/06/18 PHP
javascript静态的url如何传递
2007/05/03 Javascript
基于Jquery的简单图片切换效果
2011/01/06 Javascript
js 静态动态成员 and 信息的封装和隐藏
2011/05/29 Javascript
javascript中的delete使用详解
2013/04/11 Javascript
用js的for循环获取radio选中的值
2013/10/21 Javascript
javascript上下方向键控制表格行选中并高亮显示的方法
2015/02/13 Javascript
Javascript 基础---Ajax入门必看
2016/07/06 Javascript
Bootstrap零基础学习第一课之模板
2016/07/18 Javascript
JS新包管理工具yarn和npm的对比与使用入门
2016/12/09 Javascript
bootstrap 下拉多选框进行多选传值问题代码分析
2017/02/14 Javascript
Jquery中attr与prop的区别详解
2017/05/27 jQuery
jQuery异步提交表单实例
2017/05/30 jQuery
Vue2.x中的Render函数详解
2017/05/30 Javascript
JavaScript递归函数定义与用法实例分析
2019/01/24 Javascript
Vue使用axios出现options请求方法
2019/05/30 Javascript
对Layer UI 模块化的用法详解
2019/09/26 Javascript
常见的python正则用法实例讲解
2016/06/21 Python
Python基于回溯法子集树模板解决找零问题示例
2017/09/11 Python
Python实现微信小程序支付功能
2019/07/25 Python
Pytorch实现神经网络的分类方式
2020/01/08 Python
详解python中GPU版本的opencv常用方法介绍
2020/07/24 Python
Windows下Sqlmap环境安装教程详解
2020/08/04 Python
CSS3实现时间轴效果
2016/07/11 HTML / CSS
Python如何定义一个函数
2015/09/01 面试题
冬季安全检查方案
2014/05/23 职场文书
工厂仓库管理员岗位职责
2015/04/09 职场文书
2015年会计工作总结范文
2015/05/26 职场文书
新党员入党决心书
2015/09/22 职场文书
学习经验交流会总结
2015/11/02 职场文书
交通安全学习心得体会
2016/01/18 职场文书
Python基础之教你怎么在M1系统上使用pandas
2021/05/08 Python
mysql中数据库覆盖导入的几种方式总结
2022/03/25 MySQL
VMware虚拟机安装 Windows Server 2022的详细图文教程
2022/09/23 Servers