IE6下focus與blur錯(cuò)亂的解決方案
更新時(shí)間：2011年07月31日 23:16:14 作者：
Miller同學(xué)發(fā)現(xiàn)的IE6 bug：如以下代碼，點(diǎn)擊textarea時(shí)，引發(fā)window的blur，導(dǎo)致focus與blur配對(duì)混亂
復(fù)制代碼 代碼如下:
<body>
<textarea></textarea>
hello
<script>
window.onblur=function(){
document.title= 'blur:' + Math.random() ;
}
window.onfocus=function(){
document.title= 'focus:' + Math.random() ;
}
</script>
</body>
這應(yīng)該是一個(gè)很常見(jiàn)的需求，例如，當(dāng)前窗口定期更新數(shù)據(jù)，而窗口失焦則減少信息更新頻率。IE6的bug導(dǎo)致的配對(duì)混亂卻會(huì)打亂我們的計(jì)劃。
上網(wǎng)查也沒(méi)查出關(guān)于這個(gè)bug的官方說(shuō)明與推薦解決方案，只好自己生更的實(shí)現(xiàn)一個(gè)解決方案。
代碼如下：
復(fù)制代碼 代碼如下:
<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>
大略原理是：找到很多可能觸發(fā)onfocus與onblur的時(shí)機(jī)，所有的onblur都立即執(zhí)行，而onfocus則延時(shí)10毫秒懶惰執(zhí)行。
結(jié)果是：雖說(shuō)有時(shí)多執(zhí)行了幾次myFocus與myBlur，但能保證窗口狀態(tài)的正確性。
方法可能有點(diǎn)山寨，不過(guò)一時(shí)沒(méi)想到更好的辦法，這樣也暫時(shí)能解個(gè)燃眉之急。
相關(guān)文章
函數(shù)是一塊js代碼塊,被定義一次但可以執(zhí)行和調(diào)用多次,js中的函數(shù)也是對(duì)象可以像其他對(duì)象那樣操作和執(zhí)行,js函數(shù)也被稱為函數(shù)對(duì)象,本文給大家介紹JS函數(shù)的返回值如何使用,感興趣的朋友跟隨小編一起看看吧2024-02-02
微信小程序如何調(diào)用json數(shù)據(jù)接口并解析
這篇文章主要介紹了微信小程序如何調(diào)用json數(shù)據(jù)接口并解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-06-06
這篇文章主要介紹了jQuery獲取隨機(jī)顏色的實(shí)例代碼,非常不錯(cuò)，具有一定的參考借鑒價(jià)值，感興趣的朋友跟隨腳本之家小編來(lái)學(xué)習(xí)吧2018-05-05
JS生態(tài)系統(tǒng)加速Tailwind?CSS工作原理探究
這篇文章主要為大家介紹了JS?生態(tài)系統(tǒng)加速Tailwind?CSS使用及工作原理探究,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2024-01-01
JavaScript基于ChatGPT實(shí)現(xiàn)打字機(jī)消息回復(fù)
ChatGPT 是一個(gè)基于深度學(xué)習(xí)的大型語(yǔ)言模型，處理自然語(yǔ)言需要大量的計(jì)算資源和時(shí)間，響應(yīng)速度肯定比普通的讀數(shù)據(jù)庫(kù)要慢的多，本文介紹了ChatGPT打字機(jī)消息回復(fù)實(shí)現(xiàn)原理，感興趣的同學(xué)可以跟著小編一起學(xué)習(xí)2023-05-05
JavaScript中的模塊化是指將每個(gè)js文件會(huì)被認(rèn)為單獨(dú)一個(gè)的模塊。模塊之間是互相不可見(jiàn)的。如果一個(gè)模塊需要使用另一個(gè)模塊，那么需要通過(guò)指定語(yǔ)法來(lái)引入要使用的模塊，而且只能使用引入模塊所暴露的內(nèi)容2022-11-11
要想知道它們是怎么停止的，首先我們要了解它們的運(yùn)行機(jī)制和原理，下面是具體的介紹。2011-01-01
js類中獲取外部函數(shù)名的方法...2007-08-08
javascript產(chǎn)生隨機(jī)數(shù)方法匯總
這篇文章主要介紹了javascript產(chǎn)生隨機(jī)數(shù)方法匯總的相關(guān)資料,需要的朋友可以參考下2016-01-01
這篇文章主要介紹了JavaScript限定圖片顯示大小的方法,涉及javascript針對(duì)圖片的操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-03-03