easyui页面一打开的时候出现短暂混乱的问题,解决办法

偶尔善良 提交于 2019-11-29 01:50:41

很多同学在布局用到easyui的时候总会出现一个问题。就是在一进入主界面的时候,页面的并不是马上就展现,而是会有一个混乱的过程,之后一闪就又好了。其实这个就是因为easyui是在dom载入完毕之后才会对整个页面进行解析,

解决办法:要解决这个问题其实只要好好利用这个onComplete 事件在结合一个载入遮罩就解决问题了。

 

首先你在body下面第一行加入一个载入提示遮罩div

<div 
id='Loading' 
style="position:absolute;z-index:1000;top:0px;left:0px;width:100%;height:100%;
       background:#DDDDDB url('style/images/bodybg.jpg');
       text-align:center;padding-top: 20%;">
   <h1>
        <image src='style/images/loading.gif'/>
        <font color="#15428B">
             加载中···
        </font>
   </h1>
</div>

再在head里面就加入一段js:

<script>
function closes(){
	$("#Loading").fadeOut("normal",function(){
		$(this).remove();
	});
}
var pc;
$.parser.onComplete = function(){
	if(pc) clearTimeout(pc);
	pc = setTimeout(closes, 1000);
}
</script>

 

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!