解决方案,找了下资料,加一个遮罩层,提升用户体验。

<script type="text/javascript">
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight; var html = "<div id='loading' style='position:absolute;left:0;width:100%;height:" + height + "px;top:0;background:#E0ECFF;opacity:1;filter:alpha(opacity=100);'>";
//html += "<div style='position:absolute;cursor1:wait;left:" + ((width / 2) - 75) + "px;top:200px;width:150px;height:16px;padding:12px 5px 10px 30px;";
//html += "background:#fff url(../themes/default/images/loading.gif) no-repeat scroll 5px 10px;border:2px solid #ccc;color:#000;'>";
//html += "正在加载,请等待...";
//html += "</div>";
html += "</div>"; window.onload = function () {
var mask = document.getElementById('loading');
mask.parentNode.removeChild(mask);
};
document.write(html);
document.write(html);
</script>
//获取浏览器页面可见高度和宽度
var height = document.documentElement.clientHeight,
width = document.documentElement.clientWidth; //在页面未加载完毕之前显示的loading Html自定义内容
var html = "<div id='loading' style='position:absolute;left:0;width:100%;height:" + height + "px;top:0;background:#E0ECFF;opacity:1;filter:alpha(opacity=100);'>";
html += "</div>";
//呈现loading效果
document.write(html); //监听加载状态改变
document.onreadystatechange = completeLoading; //加载状态为complete时移除loading效果
function completeLoading() {
if (document.readyState == "complete") {
var loadingMask = document.getElementById('loadingDiv');
loadingMask.parentNode.removeChild(loadingMask);
}
}

easyui datagrid JS加载样式 表头乱的更多相关文章

  1. easyui datagrid 动态加载数据 渲染问题,表格错位问题

    $('#dg').datagrid({ url:'datagrid_data.json', columns:[[ {field:'code',title:'Code',width:100}, {fie ...

  2. easyui datagrid 异步加载数据时滚动条有时会自动滚到最底部的问题

    在使用easyui 的datagrid异步加载数据时发现滚动条有时会自动滚到最底部.经测试发现,如果加载数据前没有选中行则不会出现这个问题.这样我们可以在重新异步加载数据前取消选中行就可以避免这个问题 ...

  3. EasyUI datagrid 动态加载表头和数据

    首先返回到页面的需要是JSON数据: 第一步: 遍历表头,插入到array中 for (var i = 0; i < jsonObj.title.length; i++) { //把返回的数据封 ...

  4. EasyUI datagrid easyui datagrid +dialog 加载 可直接运行 七

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta ht ...

  5. easyui datagrid onLoadSuccess加载两次。。

    今天使用EasyUI的datagrid时发现首次打开页面时onLoadSuccess方法执行了两次.后来发现主要问题是datagrid被初始化了两次.主要原因是一开始html中声明了dg为easyui ...

  6. jquery easyui datagrid 远程加载数据----javascript法

    jquery easyui有三种办法生成datagrid(数据网格),本篇专门讨论javascript借助jquey easy ui实现的方式 html部分 <main role="m ...

  7. EasyUI datagrid动态加载json数据

    最近做一个项目,要求是两张张表可能查找出10多种不同的结果集. 如果想只用一个表格就把全部的结果不同的显示出来那么就肯定不同使用固定的字段名字,要通过动态加载后台返回来的数据把它显示出来就必须动态加载 ...

  8. jquery easyui datagrid 动态 加载列

    实现方式: 首先根据输入的sql语句获得相关的列名称返回给前台,然后在datagrid中动态加载列,接着根据查询条件(包括sql语句)获取相关的记录返回给前台用于填充datagrid.从而实现类似or ...

  9. jquery easyui datagrid 远程加载数据----把主键渲染为值遇到的问题及解决方案

    起因:数据库中一些字段存的是代表具体值的数字,需要渲染为具体值 monggodb中的字典 mysql中存放的值为:expertin代表教练擅长的搏击技能 jquery easyui中的相关代码如下:用 ...

随机推荐

  1. 最优-scroll事件的监听实现

    1. 背景和目标 前端在监听scroll这类高频率触发事件时,常常需要一个监听函数来实现监听和回调处理.传统写法上利用setInterval或setTimeout来实现. 为了减小 CPU 开支,往往 ...

  2. JavaScript--水平幻灯片

    // 列表布局,图片左浮动,外侧容器设置overflow:hidden; // 组合使用构造函数模式(对象不共享的数据)和原型模式(对象共享的数据) <!DOCTYPE html> < ...

  3. mysql之Navicat工具、pymysql模块

    1. IDE工具介绍(Navicat) 为了方便测试,使用IDE工具,就是Navicat,这个工具本质上就是一个socket客户端,可视化的连接mysql服务端的一个工具,并且是图形界面版的.它和直接 ...

  4. Salesforce DX 简介

    Salesforce DX Salesforce DX (Salesforce Developer Experience) 是 Salesforce 推出的一个新的开发和部署模式,旨在提供更好的开发者 ...

  5. Linux 目录结构学习与简析 Part2

    linux目录结构学习与简析 by:授客 QQ:1033553122 ---------------接Part 1-------------- #1.查看CPU信息 #cat /proc/cpuinf ...

  6. [20171221]利用rman实现2台机器文件拷贝.txt

    [20171221]利用rman实现2台机器文件拷贝.txt --//昨天使用rman duplicate建立dg,我看到执行如下代码: RMAN> duplicate target datab ...

  7. 项目 插件 -下载- 使用,jar包-下载

    插件 -下载- 使用 BootCDN前端开源项目https://www.bootcdn.cn/all/ bootstrap:HTML.CSS 和 JS 框架    插件https://v3.bootc ...

  8. JavaScript高级特性-实现继承的七种方式

    声明和约定: 在C++和Java中,我们可以通过关键字class来声明一个类,在JavaScript中没有这个关键字,但我们知道可以通过new一个function创建对象,这个function类似C+ ...

  9. Centos7下chkconfig设置MySql自动启动

    1.将服务文件拷贝到init.d下,并重命名为mysql cp /usr/local/mysql/support-files/mysql.server /etc/init.d/mysql 2.赋予可执 ...

  10. 【PAT】B1085 PAT单位排行(25 分)(c++实现)

    终于做的有点眉目了,今天学习了一点stl的皮毛,解题瞬间变容易了 下边开始分析本题 这道题如果用纯c解决实在太麻烦,试了半天两个超时,果断放弃,还是用map方便: 我的方法与柳神的方法是有区别的,我只 ...