Miller同學發現的IE6 bug:如以下代碼,點選textarea時,引發window的blur,導緻focus與blur配對混亂:
<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的官方說明也推薦解決方案,隻好自己生更的實作一個解決方案。
代碼如下:
Venus'Blog<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,但能保證視窗狀态的正确性。
方法可能有點山寨,不過一時沒想到更好的辦法,這樣也暫時能解個燃眉之急。