0
0

获取documentElement/body坐标引发IE select无法隐藏的bug

rank 发表于 2012年12月19日 13:42 | Hits: 1878
Tag: 开发日志

找了好久。。。应该没人遇到过吧,或者很多人遇到也跳过了这个bug

获取document.Element.offsetLeft/offsetTop/scrollLeft/scrollTop
或者document.body.offsetLeft/offsetTop/scrollLeft/scrollTop坐标都会引发bug
啥都不说了,这也可以引发bug。。。特别对于框架代码包装来包装去的,一层层剥开真花时间。
看代码吧,已经作了详细注释。

<!doctype html>
<html>
  <head>
    <meta charset="gbk">
    <meta http-equiv="Content-Type" content="text/html; charset=gbk" />
    <meta http-equiv="X-UA-Compatible" content="IE=7">
    <style text="text/css">
      * { font:12px/2 arial;}
      h1, h2 {font-weight:bold;}
      h1 {font-size:16px}
      h2 {font-size:14px}
    </style>
  </head>

  <body>
    <h1> get dom coordinate select can not hidden in IE6 or IE9 bug </h1>
    <div>
      <h2>selectA container</h2>
      <select id="selectA" size=2>
        <option selected value=1>selectB should be display</option>
        <option value=2>selectB should be hidden</option>
      </select>
    </div>

    <div style="background:#eee;" id="containerB">
      <h2>selectB container</h2>
      <select id="selectB" size=6></select>
    </div>

    <script type="text/javascript">
    onload = function() {
      var $ = function(id) {return document.getElementById(id);},
        a = $('selectA'),
        b = $('selectB'),
        bc = $('containerB');

      a.onchange = function (e) {
        if (a.value=='2'){
          bc.style.display = "none";//如果把隐藏放到添加option之后,或用visibility=hidden,都没有问题。
          document.body.offsetLeft;
          //document.Element.offsetLeft/offsetTop/scrollLeft/scrollTop
          //selectB can not hidden in IE6
          var optgroup = document.createElement('optgroup'); //用add(new Option(text, value))在一些情况下也会出现不能隐藏
            optgroup.label = Math.random();
          b.appendChild(optgroup);
        } else{
          bc.style.display = "block";
        }
      };
    };
    </script>
  </body>
</html>

原文链接: http://www.never-online.net/blog/article.asp?id=329

0     0

评价列表(0)