zoukankan      html  css  js  c++  java
  • ext 3.3 tree 在IE10中的bug

    ext3.3 中的tree在ie中进行兼容性测试,遇到ie10时,无法点击,其他版本的IE(7、8、9、11)均正常。

    测试html如下:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <title>Hello World</title>
    <link href="js/ext/resources/css/ext-all.css" rel="stylesheet"
    type="text/css" />
    <script type="text/javascript" src="js/ext/adapter/ext/ext-base.js"></script>
    <script src="js/ext/ext-all-debug.js" type="text/javascript"></script>
    <body>
    <script type="text/javascript">
    
    Ext.onReady(function(){ 
      var tree=new Ext.tree.TreePanel({ 
                el:'tree', 
                autoHeight:true 
                }); 
      var root=new Ext.tree.TreeNode({text:'区域信息'}); 
      var node1=new Ext.tree.TreeNode({text:'湖南省'}); 
      var node3=new Ext.tree.TreeNode({text:'广东省'}); 
      var node2=new Ext.tree.TreeNode({text:'广州市'}); 
      node3.appendChild(node2); 
      root.appendChild(node1); 
      root.appendChild(node3); 
      tree.setRootNode(root); 
      tree.render(); 
    }); 
    </script>
    </head>
    <body>
    <div id="tree"></div>
    </body>
    </html>

    在网上搜索得知,此bug是由于ext-all.js中的getAttributeNS方法不能兼容IE10出错引起

    http://bbs.csdn.net/topics/390438841

    当然,贴中的方法经测试是可以用在IE10中的,不过实在是针对性太强,解决了IE10,估计其他的又会出错。

    个人估计ext肯定对这块也会做修改的,于是下载了ext3.4,果不其然,这里的getAttributeNS 被重写了:

    3.3代码:

    getAttribute : Ext.isIE ? function(name, ns){
    
    var d = this.dom,
    type = typeof d[ns + ":" + name];
    
    if(['undefined', 'unknown'].indexOf(type) == -1){
    return d[ns + ":" + name];
    }
    return d[name];
    } : function(name, ns){
    var d = this.dom;
    return d.getAttributeNS(ns, name) || d.getAttribute(ns + ":" + name) || d.getAttribute(name) || d[name];
    },
    
    

    3.4代码:

    getAttribute: (function(){
    var test = document.createElement('table'),
    isBrokenOnTable = false,
    hasGetAttribute = 'getAttribute' in test,
    unknownRe = /undefined|unknown/;
    
    if (hasGetAttribute) {
    
    try {
    test.getAttribute('ext:qtip');
    } catch (e) {
    isBrokenOnTable = true;
    }
    
    return function(name, ns) {
    var el = this.dom,
    value;
    
    if (el.getAttributeNS) {
    value = el.getAttributeNS(ns, name) || null;
    }
    
    if (value == null) {
    if (ns) {
    if (isBrokenOnTable && el.tagName.toUpperCase() == 'TABLE') {
    try {
    value = el.getAttribute(ns + ':' + name);
    } catch (e) {
    value = '';
    }
    } else {
    value = el.getAttribute(ns + ':' + name);
    }
    } else {
    value = el.getAttribute(name) || el[name];
    }
    }
    return value || '';
    };
    } else {
    return function(name, ns) {
    var el = this.om,
    value,
    attribute;
    
    if (ns) {
    attribute = el[ns + ':' + name];
    value = unknownRe.test(typeof attribute) ? undefined : attribute;
    } else {
    value = el[name];
    }
    return value || '';
    };
    }
    test = null;
    })(),
    
     

    将3.4中的方法写入3.3的ext-all.js中,ie10中tree恢复正常。

  • 相关阅读:
    QT 十六进制字符串转化为十六进制编码
    C语言中函数有输出参数
    QT 字符串相等间距字符间增加字符
    CRC校验算法
    QT 环境下开发socketCan接口程序
    QT 十六进制整数变为字符串自动补0 && 十进制补零
    C语言函数返回数组
    JNI文件中命名类与JAVA文件中匹配
    mini6410-JNI-led
    gis 出现问题解决办法
  • 原文地址:https://www.cnblogs.com/malaya/p/3757252.html
Copyright © 2011-2022 走看看