jquery_jquery の下にオーバーレイ マスク レイヤー コードを実装します。

复制代码代码如下:

/*
模态遮罩层单例对オブジェクト
不透明度:背景透明度
1. show()
2. close()
*/
Q.Overlay = function(opacity) {
var self = this;
self._createDiv = function() {

if (self._overlay) return;
self._overlay = $("

");

var overlayCss = {
'width': '100%',
'min-height': '100%',
'position': 'fixed',
'top': 0、
'left': 0、
'z-index': Q.Overlay.zindex、
'background': '#ccc'、
'text-align' : '中心',
'不透明度': 不透明度
};

if ($.browser.msie && $.browser.version.substr(0, 1) overlayCss.position = "絶対";
overlayCss.height = Q.dom.pageHeight();
}
self._overlay.css(overlayCss);
$(document.body).append(self._overlay);
};
self.show = function() {
self._createDiv();
Q.Overlay.zindex ;
self._overlay.show();
};
self.close = function() {
self._overlay.hide();
self._overlay.remove();
self._overlay = 未定義;
};
}
Q.Overlay.zindex = 1000;

下は応用用の小例です、一处理ajax要求中利用完全透明遮蔽層组织用户和界面元素交换、当ajax出错時提示用户
代码

复制代 代码如下:

/*统一ajax错误处理*/
Q.initAjaxErrorHandler = function( ) {
var overlay = new Q.Overlay(0.0);
$(document.body).ajaxStart(function() { overlay.show(); });
$(document.body).ajaxSuccess(function() { overlay.close(); });
$(document.body).ajaxError(function() { Q.alert("请求出错，请刷新页面并稍候再试！") });
}