EasyUI 兼容 IE6 方法总结 1 . 背景 1.1 项目介绍 安徽XXXXXX 服务平台从 7 月低开始框架搭建，前端UI 框架确定使用目前功能比较完善的Jquery EasyUI（没有考虑到客户方目前使用的浏览器大部分都是IE6，项目设计初期的不严谨）。11 初基本功能开发完成，期间一直致力于功能的实现和数据的一致性的核查，并没有太多关注浏览器的兼容性和性能问题。经过在客户现场几次演示的结果，暴露出严重的性能问题和兼容性问题，在IE6 下，系统基本不能运行。于是开始着手调整这些问题。 1.2 框架介绍 优点：JQuery EasyUI 是目前功能比较齐全的一套 UI 框架，为我们提供了大多数UI 控件的使用，如：accordion， combobox， menu， dialog， tabs， tree， validatebox， window 等，方便开发人员使用，提高开发效率，正是基于这些考虑，项目设计的时候决定使用该框架。 缺点：界面兼容程度不够，不过大部分都发生在IE6 下，在 IE7+ 、 FF 等浏览器中显示正常。 2 . 详细分析 2.1 页面重复加载问题 1) 问题现象 点击左侧的菜单，右侧页面被加载了两次。 第1 页，共10 页 2) 问题分析 ○1 修改前部分代码 $(document).ready(function(){ $('#header').panel({href: ctx +'/view/common/header.jsp',onLoad:function(){ $("div.topMenu li a").click(function(){ $(this).addClass("topMenu-item-current"); $(this).parent().siblings().children().removeClass("topMenu-item-current"); if(this.id == "js") { $('#main').panel("refresh",ctx +"/view/busi/busi_index.jsp"); addLeftClick(); }else if(this.id == "cl") { ………….. } }); }}); }); function addLeftClick(){ $('#main').panel({ onLoad:function(){ $(".leftMenu li a").click(function(){ $(this).addClass("selected"); $(this).parent().siblings().children().removeClass("selected"); }); 第2 页，共10 页 } }); }; ○2 修改后部分代码 $(document).ready(function(){ $('#header').panel({href: ctx +'/view/common/header.jsp',onLoad:function(){ $("div.topMenu li a").click(function(){ $(this).addClass("topMenu-item-current"); $(this).parent().siblings().children().removeClass("topMenu-item-current"); if(this.id == "js") { addLeftClick(ctx +...
