IE6下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的官方说明与推荐解决方案,只好自己生更的实现一个解决方案。

  代码如下:

  

复制代码 代码如下:

  <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,但能保证窗口状态的正确性。

  方法可能有点山寨,不过一时没想到更好的办法,这样也暂时能解个燃眉之急。