JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法


Posted in Javascript onJune 23, 2014

网上答案说是因为Easy-ui在低版本时应将class样式删去,而在javascript里写url,因为class里有url的话javascript里也存在url,就会使页面刷新俩次,但是测试后没有解决我的问题,后来通过反复测试终于找到问题,

<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>
Javascript 相关文章推荐
Javascript面向对象编程(二) 构造函数的继承
Aug 28 Javascript
基于jQuery的模仿新浪微博时间的组件
Oct 04 Javascript
JSON序列化与解析原生JS方法且IE6和chrome测试通过
Sep 05 Javascript
jquery实现图片按比例缩放示例
Jul 01 Javascript
js图片模糊切换显示特效的方法
Feb 17 Javascript
Vue.js绑定HTML class数组语法错误的原因分析
Oct 19 Javascript
AngularJS实现路由实例
Feb 12 Javascript
js以及jquery实现手风琴效果
Apr 17 Javascript
详解vue项目首页加载速度优化
Oct 18 Javascript
微信小程序设置滚动条过程详解
Jul 25 Javascript
Node.js Domain 模块实例详解
Mar 18 Javascript
JS绘图Flot如何实现可选显示曲线图功能
Oct 16 Javascript
教你用AngularJS框架一行JS代码实现控件验证效果
Jun 23 #Javascript
js自定义鼠标右键的实现原理及源码
Jun 23 #Javascript
js代码实现的加入收藏效果并兼容主流浏览器
Jun 23 #Javascript
用jquery的方法制作一个简单的导航栏
Jun 23 #Javascript
jquery的attr方法禁用表单元素禁用输入内容
Jun 23 #Javascript
JavaScript获取某年某月的最后一天附截图
Jun 23 #Javascript
一个判断抢购时间是否到达的简单的js函数
Jun 23 #Javascript
You might like
PHP 开源框架22个简单简介
2009/08/24 PHP
PHP启动windows应用程序、执行bat批处理、执行cmd命令的方法(exec、system函数详解)
2014/10/20 PHP
php学习笔记之基础知识
2014/11/08 PHP
php实现对象克隆的方法
2015/06/20 PHP
php 文件下载 出现下载文件内容乱码损坏的解决方法(推荐)
2016/11/16 PHP
可兼容php5与php7的cURL文件上传功能实例分析
2018/05/11 PHP
php实现快速对二维数组某一列进行组装的方法小结
2019/12/04 PHP
gearman中任务的优先级和返回状态实例分析
2020/02/27 PHP
有关js的变量作用域和this指针的讨论
2010/12/16 Javascript
jquery实现输入框动态增减的实例代码
2013/07/14 Javascript
js判断变量初始化的三种形式及推荐用的形式
2014/07/22 Javascript
JS取得绝对路径的实现代码
2015/01/16 Javascript
JQuery实现鼠标滚轮滑动到页面节点
2015/07/28 Javascript
JavaScript实现cookie的写入、读取、删除功能
2015/11/05 Javascript
javaScript中的原型解析【推荐】
2016/05/05 Javascript
jQuery实现日期联动效果实例
2016/07/26 Javascript
AngularJs中 ng-repeat指令中实现含有自定义指令的动态html的方法
2017/01/19 Javascript
在node.js中怎么屏蔽掉favicon.ico的请求
2017/03/01 Javascript
js轮播图透明度切换(带上下页和底部圆点切换)
2017/04/27 Javascript
vue.js中proxyTable 转发请求的实现方法
2018/09/20 Javascript
手动下载Chrome并解决puppeteer无法使用问题
2018/11/12 Javascript
node.JS的crypto加密模块使用方法详解(MD5,AES,Hmac,Diffie-Hellman加密)
2020/02/06 Javascript
python连接mysql调用存储过程示例
2014/03/05 Python
python使用PyFetion来发送短信的例子
2014/04/22 Python
分享Python文本生成二维码实例
2016/01/06 Python
Python爬虫获取整个站点中的所有外部链接代码示例
2017/12/26 Python
python使用pandas实现数据分割实例代码
2018/01/25 Python
DataFrame中去除指定列为空的行方法
2018/04/08 Python
Python图像处理之简单画板实现方法示例
2018/08/30 Python
python中的for循环
2018/09/28 Python
Django为窗体加上防机器人的验证码功能过程解析
2019/08/14 Python
Python3实现二叉树的最大深度
2019/09/30 Python
Python在centos7.6上安装python3.9的详细教程(默认python版本为2.7.5)
2020/10/15 Python
如何查看在weblogic中已经发布的EJB
2012/06/01 面试题
新教师岗前培训方案
2014/06/05 职场文书
2016党员入党决心书
2015/09/22 职场文书