EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)
更新时间：2016年02月21日 13:57:25 作者：雷文
这篇文章主要介绍了EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)的相关资料,需要的朋友可以参考下
使用EasyUI时，有个经常遇到的问题，页面还没有渲染完成的时候，就展现了。
刚刚开始很混乱，等加载完成后，就好了。
$.parser.onComplete，这个是在所有组件解析完成后执行的事件。其实这个事件很有用的。很多在布局用到easyui的时候总会出现一个问题。就是在一进入主界面的时候，页面的并不是马上就展现，而是会有一个混乱的过程，之后一闪就又好了。
其实这个就是因为easyui是在dom载入完毕之后才会对整个页面进行解析，当你们布局和组件使用的比较多的时候，完整的解析组件就需要一个过程，而在这个过程中就会出现短暂的界面混乱现象。
要解决这个问题其实只要好好利用这个onComplete 事件在结合一个载入遮罩就解决问题了。
把需要这个动画效果的，放到一个页面中去。
<#include "common/loadingDiv.html"/>（Freemarker的include语法，模版用的.html后缀）
loadingDiv.html
<div id='loadingDiv' style="position: absolute; z-index: 1000; top: 0px; left: 0px;
width: 100%; height: 100%; background: white; text-align: center;">
<h1 style="top: 48%; position: relative;">
<font color="#15428B">努力加载中···</font>
</h1>
t;/div>
<script type="text/javascript">
function closeLoading() {
$("#loadingDiv").fadeOut("normal", function () {
$(this).remove();
});
}
var no;
$.parser.onComplete = function () {
if (no) clearTimeout(no);
no = setTimeout(closeLoading, 1000);
}
</script>
以上内容是小编给大家介绍的EasyUI闪屏EasyUI页面加载提示，希望对大家以上帮助！
相关文章
这篇文章主要给大家介绍了关于js中join()方法的相关资料,join方法用于把数组中的所有元素放入一个字符串,文中通过代码以及图文介绍的非常详细,需要的朋友可以参考下2023-10-10
在js中将中文用gb2312编码。如，“我”编码后应该是“%CE%D2”。2009-12-12
这篇文章主要介绍了微信小程序iOS下拉白屏晃动问题解决方案,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2019-10-10
最近开发一个CMS系统使用上了Bootstrap，在开发一个添加某些选项时，打算弹出一个模态框，但是发现，模态框不会垂直居中到屏幕上，而是在屏幕上方,通过查阅资料才解决此问题，下面小编给大家分享解决思路2016-11-11
SOSO地图想必大家都知道吧，本文将为大家详细介绍下使用JS画出标注和中心点,直接贴出代码，感兴趣的朋友可以参考下2013-08-08
这篇文章主要介绍了json的结构与遍历方法,结合具体实例形式分析了json常见的简单与复杂结构表示方法,以及具体的遍历操作实现技巧,需要的朋友可以参考下2017-04-04
这篇文章主要介绍了JavaScript获取当前运行脚本文件所在目录的方法,涉及JavaScript文件目录操作的相关技巧,需要的朋友可以参考下2016-02-02
typescript使用 ?. ?? ??= 运算符的方法步骤
本文主要介绍了typescript使用 ?. ?? ??= 运算符的方法步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2024-01-01
使用JS前端加密库sm-crypto实现国密sm2、sm3和sm4加密与解密
这篇文章主要介绍了使用JS前端加密库sm-crypto实现国密sm2、sm3和sm4加密与解密,需要的朋友可以参考下2024-06-06
这篇文章主要为大家详细介绍了javascript实现拖拽碰撞检测,碰撞改变颜色，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-03-03
最新评论