关于JQEasy-ui在IE低版本下二次加载的问题
2014-06-23 09:44
405 查看
之前项目中才用了Easy-ui,但是在同时使用tree和grid的效果时,因为页面有俩个URL,分别为Ajax树去后台取数据和Grid取数据,在IE9以上以及其他浏览器里都没有问题,在Ie低版本时会出现先加载表格,然后一闪而过加载树渲染页面,造成页面只有tree数据而没有表格grid数据。网上答案说是因为Easy-ui在低版本时应将class样式删去,而在javascript里写url,因为class里有url的话javascript里也存在url,就会使页面刷新俩次,但是测试后没有解决我的问题,后来通过反复测试终于找到问题,
因为在页面写了style,将style里的样式删去就可以解决问题了,现附上完整的ajax动态树和Grid表格代码。
<ul id="eva" style=" font-size:25px; "> </ul>
因为在页面写了style,将style里的样式删去就可以解决问题了,现附上完整的ajax动态树和Grid表格代码。
<html> <head> <title>Tree</title> <link href="../../Content/JQEasyUI/themes/default/easyui.css" rel="stylesheet" type="text/css" /> <link href="../../Content/JQEasyUI/themes/icon.css" rel="stylesheet" /> <script src="../../Scripts/jquery-1.4.4.min.js" type="text/javascript"></script> <script src="../../Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script> <script src="../../Scripts/jquery.easyui.min.js" type="text/javascript"></script> <script src="../../Scripts/easyui-lang-zh_CN.js" type="text/javascript"></script> <script type="text/javascript"> var NodeText; var time; var treeeva; $(function () { initTable(); $("#SelectForm").css("display", "none"); bindSearcheClick(); $('#eva').tree({ url: '/OEE/GetTree', method: 'get', animate: true, checkbox: true }); }); //初始化表格 function initTable() { $('#tt').datagrid({ url: '/OEE/Details', title: 'OEE', width: 700, height: 360, fitColumns: true, idField: 'Fid', loadMsg: '正在加载设备的信息...', pagination: true, singleSelect: false, pageSize: 10, pageNumber: 1, pageList: [10, 20, 30], queryParams: {//要传入的参数 NodeResult: NodeText, SelectTime: $('#SelectTime').datebox('getValue') }, columns: [[//{EID, ETypeName, ThenTypeInfoTID, EtypeNum} {field: 'Num', title: '设备编号', width: 80, align: "center" }, { field: 'Name', title: '设备名称', width: 80, align: "center" }, { field: 'EarlyTimeOEE', title: '早班OEE', width: 80, align: "center" }, { field: 'MiddleTimeOEE', title: '午班OEE', width: 80, align: "center" }, { field: 'LaterTimeOEE', title: '晚班OEE', width: 80, align: "center" }, { field: 'DelFlag', title: '操作', width: 80, align: 'center', formatter: function (value, row, index) { var str = "<a Fid='" + row.Fid + "' class='SelectInfo' href='javascript:void(0)'>明细</a> "; return str; } } ]], onHeaderContextMenu: function (e, field) { }, onLoadSuccess: function (data) { $(".SelectInfo").unbind("click"); $(".SelectInfo").bind("click", function () { doSelect($(this).attr("Fid"), time); return false; }); } }); } function doSelect(Fid, Time) { var reg = new RegExp("-", "g"); var strobj = Fid.toString(); var newstr = strobj.replace(reg, "$"); $('#SelectFrame').attr('src', '/OEE/GetSelectInfo/' + Fid + '/' + Time); $('#SelectForm').css('display', 'block'); $('#SelectForm').dialog({ width: 470, height: 470, modal: true, title: "显示明细信息", collapsible: true, minimizable: true, maximizable: true, resizable: true, buttons: [{ id: 'btnSelect', text: '确定', iconCls: 'icon-add', handler: function () { $("#SelectForm").dialog("close"); } }] }); } //绑定搜索查询的 点击事件 function bindSearcheClick() { //linkButtonSearch $("#linkButtonSearch").click(function () { var nodes = $('#eva').tree('getChecked'); var s = ''; for (var i = 0; i < nodes.length; i++) { if (s != '') s += ','; s += nodes[i].id; } NodeText = s; time = $('#SelectTime').datebox('getValue'); initTable(); }); } </script> </head> <body> <div style="width: 1000px"> <div style="width: 200px; float: left"> <div style="margin: 23px 0;"> </div> <div class="easyui-panel" style="padding: 5px; border-radius: 5px;"> <ul id="eva" > </ul> </div> </div> <div id="Right"> <div id="query"> 查询时间:<input class="easyui-datebox" name="SelectTime" id="SelectTime" /> <a id="linkButtonSearch" href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-search'"> 查询</a> </div> <table id="tt" style="width: 700px;" title="标题" iconcls="icon-edit"> </table> <div id="SelectForm"> <iframe id="SelectFrame" src="javascript:void(0)" frameborder="0" width="100%" height="100%"> </iframe> </div> </div> </div> </body> </html>
相关文章推荐
- JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法
- easy-ui 关于用jquery渲染的加载问题
- JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法
- 关于IE 延迟加载activex和插件未激活问题。
- 关于FlexPaper 2.1.2版本 二次开发 Logo 、打印、搜索、缩略图、添加按钮、js交互、右键菜单等相关问题
- 有关于jQuery load方法在IE Chrome无法加载问题
- 关于Linux内核可加载模块的版本问题
- 关于VS220113无法启动IIS Express,系统日志:工作进程未能预加载 .Net 运行时版本 v4.0.30128问题
- 关于IE中不同版本浏览器对parseFloat的处理问题
- 关于FlexPaper 2.1.2版本 二次开发 Logo 、打印、搜索、缩略图、添加按钮、js交互、右键菜单等相关问题
- 关于项目属相版本不对的一些问题,库加载不了
- 关于 ie 下使用 iframe 加载子页面时,子页面ajax数据能进入success方法,但是数据为空的问题
- 玩转Web之Json(一)-----easy ui+ajax + json 中关于Json的解析问题
- 关于VS2010 rcxdti.dll is unable to load rcxdtiui.dll加载失败问题的解决方案
- 关于EXTJS 2.2.1版本在IE环境下Grid组件表头下拉菜单图标错位问题的解决
- 关于FlexPaper 2.1.2版本 二次开发 Logo 、打印、搜索、缩略图、添加按钮、js交互、右键菜单等相关问题
- easy ui tree json 数据 无法加载的问题
- 关于cocostudio加载UI json CCUIHELPER未声明问题
- 关于解决jq不同版本兼容性问题
- 关于easy可编辑表格树表格刷新和加载状态问题