一,引入三个文件
jQuery版本使用 jQuery v1.7.1
jquery-easyui文件中,引入easyui-lang-zh_CN.js的js 做数据加载时使用
jquery.blockui.min.js 放有loading.gif图片及样式
<script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/easyui-lang-zh_CN.js"></script> <script type="text/javascript" src="/js/jquery.blockui.min.js"></script>
二,html部分
①.<div id="GroPro">最外层div<div>
②.修改load未铺满全文的bug
获取网页正文全文高度：document.body.scrollHeight
<script type="text/javascript"> //初始化数据前 $(document).ready(function () { window.onload = function () { getHeight();//调用函数 }; function getHeight() { var Load = document.getElementById('GroPro');//获取Load的高度 var body_height = document.documentElement.scrollHeight;//document.body.clientHeight中在<!DOCTYPE html>声明下会返回0 Load.style.height = body_height + 'px';//将正文的高度赋值给Load } }); </script>
①.PageRefreshLockHolder方法(最上方)
// 页面级刷新锁持有（可用于防止页面数据重复加载）
var PageRefreshLockHolder = {
// 可以注册加锁/解锁的事件（暂不支持）
events:{},
// 被加锁视图集合
// lockedObject:{'mapView':'0', 'leftView':'0', 'rightView':'0', 'rightAvgView':'0'},
lockedObject:{'OneView':'0'},
// 加锁动作（暂时只支持全加锁，不支持单独加锁）
lockAll:function() {
jQuery("#GroPro").block();
this.lockedObject.OneView = '1';
// this.lockedObject.leftView = '1';
},
// 解锁动作（各视图组件调用通知解锁）
unlock:function(viewName) {
this.lockedObject[viewName] = '0';
if (!this.isExistLock()) {
jQuery("#GroPro").unblock();
}
},
// 判断是否有锁
isExistLock:function() {
/*
if (this.lockedObject.mapView == '0'
&& this.lockedObject.leftView == '0'
&& this.lockedObject.rightView == '0'
&& this.lockedObject.rightAvgView == '0') {
return false;
} else {
return true;
}
*/
if (this.lockedObject.OneView == '0') {
return false;
} else {
return true;
}
}
};
②.初始化数据时先,锁定页面
$(function(){
// 锁定页面
PageRefreshLockHolder.lockAll();
});
③.账期切换(切换按钮时),相当于刷新数据
// 锁定页面
PageRefreshLockHolder.lockAll();
④.通过ajax请求数据时:(同一个页面的数据在同一个ajax中请求完成)
$.ajax( {
success : function(data) {
//最下方
// 数据请求完,解锁
PageRefreshLockHolder.unlock("OneView");
}
});
⑤.在刷新左右上下页面后,解锁
PageRefreshLockHolder.unlock("OneView");
⑥.
如果一个页面的数据是在同一个ajax中请求的,只在一个ajax中解锁页面就可以了.
如果页面中各版块数据在不同ajax中请求的,那么需要在各个版块的ajax中解锁.