zoukankan      html  css  js  c++  java
  • IE6下focus与blur错乱的解决方案

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

    代码如下:

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

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

  • 相关阅读:
    敌兵布阵(线段树单点更新+区间查询)
    小明上学(CCF认证2018-12-1 )
    There Are Two Types Of Burgers (Educational Codeforces Round 71)
    Bad Prices ( Codeforces Round #582 )
    Redis热点key优化
    Redis big key处理
    Redis的安全问题
    Redis的flushall/flushdb误操作
    Redis在linux系统中的优化
    Redis之缓存设计
  • 原文地址:https://www.cnblogs.com/jkisjk/p/ie6_bug_window_focus_blur.html
Copyright © 2011-2022 走看看