easyui datagrid JS加载样式 表头乱
解决方案,找了下资料,加一个遮罩层,提升用户体验。
<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加载样式 表头乱的更多相关文章
- easyui datagrid 动态加载数据 渲染问题,表格错位问题
$('#dg').datagrid({ url:'datagrid_data.json', columns:[[ {field:'code',title:'Code',width:100}, {fie ...
- easyui datagrid 异步加载数据时滚动条有时会自动滚到最底部的问题
在使用easyui 的datagrid异步加载数据时发现滚动条有时会自动滚到最底部.经测试发现,如果加载数据前没有选中行则不会出现这个问题.这样我们可以在重新异步加载数据前取消选中行就可以避免这个问题 ...
- EasyUI datagrid 动态加载表头和数据
首先返回到页面的需要是JSON数据: 第一步: 遍历表头,插入到array中 for (var i = 0; i < jsonObj.title.length; i++) { //把返回的数据封 ...
- EasyUI datagrid easyui datagrid +dialog 加载 可直接运行 七
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta ht ...
- easyui datagrid onLoadSuccess加载两次。。
今天使用EasyUI的datagrid时发现首次打开页面时onLoadSuccess方法执行了两次.后来发现主要问题是datagrid被初始化了两次.主要原因是一开始html中声明了dg为easyui ...
- jquery easyui datagrid 远程加载数据----javascript法
jquery easyui有三种办法生成datagrid(数据网格),本篇专门讨论javascript借助jquey easy ui实现的方式 html部分 <main role="m ...
- EasyUI datagrid动态加载json数据
最近做一个项目,要求是两张张表可能查找出10多种不同的结果集. 如果想只用一个表格就把全部的结果不同的显示出来那么就肯定不同使用固定的字段名字,要通过动态加载后台返回来的数据把它显示出来就必须动态加载 ...
- jquery easyui datagrid 动态 加载列
实现方式: 首先根据输入的sql语句获得相关的列名称返回给前台,然后在datagrid中动态加载列,接着根据查询条件(包括sql语句)获取相关的记录返回给前台用于填充datagrid.从而实现类似or ...
- jquery easyui datagrid 远程加载数据----把主键渲染为值遇到的问题及解决方案
起因:数据库中一些字段存的是代表具体值的数字,需要渲染为具体值 monggodb中的字典 mysql中存放的值为:expertin代表教练擅长的搏击技能 jquery easyui中的相关代码如下:用 ...
随机推荐
- 了解java虚拟机—G1回收器(9)
G1(Garbage-First)回收器是在JDK1.7中正式使用的全新垃圾回收器,G1拥有独特的垃圾回收策略,从分代上看,G1依然属于分代垃圾回收器,它会区分年代和老年代,依然有eden和survi ...
- 如何在表单中使用Ajax
1.HTML就是一个简单表单验证,有登录按钮,点击登录会发送Ajax, 这里就是简单如果用户名为:zhouzhiruo,密码为:123456,就是登录成功,否则登录失败 应该在发送请求之前对input ...
- Nginx拦截指定国家的IP
Nginx拦截指定国家的IP 一.下载GeoIP数据库 wget http://geolite.maxmind.com/download/geoip/api/c/GeoIP.tar.gz wget h ...
- 10个最佳ES6特性
译者按: 人生苦短,我用ES6. 原文: Top 10 ES6 Features Every Busy JavaScript Developer Must Know 译者: Fundebug 为了保证 ...
- python字典按照value进行排序
先说几个解决的方法,具体的有时间再细说 d = {'a':1,'b':4,'c':2} 字典是这个,然后要对字典按照value进行排序 方法一: sorted(d.items(),key = lamb ...
- HDU5293(SummerTrainingDay13-B Tree DP + 树状数组 + dfs序)
Tree chain problem Time Limit: 6000/3000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Other ...
- 2017-11-25 中文代码示例之Spring Boot 1.3.3演示
"中文编程"知乎专栏原文 源码: program-in-chinese/jinxiaocun 由于这个演示项目成型于去年(详见中文编程的尝试历程小记), Spring Boot还是 ...
- java程序的加载与执行
1.编写java源文件 .java 2.生成字节码文件 类名.class 3.JRE,java运行环境,包括JVM(java虚拟机).java基本类库 4.
- 【代码笔记】Web-利用Dreamweaver实现表格
一,打开Dreamweaver---->File---New---->如下图所示.选择HTML,点击OK. 二,会出现如下图所示界面.把光标放到Body处. 三,Insert---> ...
- Gartner2017年BI研究计划曝光,来看看他研究的都是啥?
文 | 水手哥 本文出自:知乎专栏<帆软数据应用研究院>——数据干货&资讯集中地 近日,Gartner发布了<Analytics and Business Intelli ...