DWR使用体会3:加载信息DWRUtil.useLoadingMessage
2007-05-12 12:02
423 查看
从DWR文档中整理出来的关于加载信息的资料。
加载信息:
1.加载时显示指定图片
在javascript中加入函数
function useLoadingImage(imageSrc) {
var loadingImage;
if (imageSrc) loadingImage = imageSrc;
else loadingImage = "ajax-loader.gif";
DWREngine.setPreHook(function() {
var disabledImageZone = $('disabledImageZone');
if (!disabledImageZone) {
disabledImageZone = document.createElement('div');
disabledImageZone.setAttribute('id', 'disabledImageZone');
disabledImageZone.style.position = "absolute";
disabledImageZone.style.zIndex = "1000";
disabledImageZone.style.left = "0px";
disabledImageZone.style.top = "0px";
disabledImageZone.style.width = "100%";
disabledImageZone.style.height = "100%";
var imageZone = document.createElement('img');
imageZone.setAttribute('id','imageZone');
imageZone.setAttribute('src',imageSrc);
imageZone.style.position = "absolute";
imageZone.style.top = "0px";
imageZone.style.right = "0px";
disabledImageZone.appendChild(imageZone);
document.body.appendChild(disabledImageZone);
}
else {
$('imageZone').src = imageSrc;
disabledImageZone.style.visibility = 'visible';
}
});
DWREngine.setPostHook(function() {
$('disabledImageZone').style.visibility = 'hidden';
});
}
然后修改body中的init()函数
function init() {
useLoadingImage("iframe/U1751P410T11D5F84DT20061207163706.jpg");
}
2.不能在body中加init()时,可用下面的方法
<script>
function init() {
DWRUtil.useLoadingMessage();
}
if (window.addEventListener) {
window.addEventListener("load", init, false);
}
else if (window.attachEvent) {
window.attachEvent("onload", init);
}
else {
window.onload = init;
}
</script>
3.实现自定义加载信息
function useLoadingMessage(message) {
var loadingMessage;
if (message) loadingMessage = message;
else loadingMessage = "Loading";
DWREngine.setPreHook(function() {
var disabledZone = $('disabledZone');
if (!disabledZone) {
disabledZone = document.createElement('div');
disabledZone.setAttribute('id', 'disabledZone');
disabledZone.style.position = "absolute";
disabledZone.style.zIndex = "1000";
disabledZone.style.left = "0px";
disabledZone.style.top = "0px";
disabledZone.style.width = "100%";
disabledZone.style.height = "100%";
document.body.appendChild(disabledZone);
var messageZone = document.createElement('div');
messageZone.setAttribute('id', 'messageZone');
messageZone.style.position = "absolute";
messageZone.style.top = "100px"; //定义显示加载信息层的位置
messageZone.style.left = "400px"; //定义显示加载信息层的位置
messageZone.style.width = "200"; //定义显示加载信息层的宽度
messageZone.style.height = "50"; //定义显示加载信息层的高度
messageZone.style.background = "green";//定义显示加载信息层的颜色
messageZone.style.color = "white";
messageZone.style.fontFamily = "Arial,Helvetica,sans-serif";
messageZone.style.padding = "4px";
disabledZone.appendChild(messageZone);
var text = document.createTextNode(loadingMessage);
messageZone.appendChild(text);
}
else {
$('messageZone').innerHTML = loadingMessage;
disabledZone.style.visibility = 'visible';
}
});
DWREngine.setPostHook(function() {
$('disabledZone').style.visibility = 'hidden';
});
}
在提供信息文字时,可以传递“<div align=center><font color=#FF99FF size=5>闹闹爱</font></div>”为信息,不过第一次显示的是代码,并不能居中及字体大小、颜色。
加载信息:
1.加载时显示指定图片
在javascript中加入函数
function useLoadingImage(imageSrc) {
var loadingImage;
if (imageSrc) loadingImage = imageSrc;
else loadingImage = "ajax-loader.gif";
DWREngine.setPreHook(function() {
var disabledImageZone = $('disabledImageZone');
if (!disabledImageZone) {
disabledImageZone = document.createElement('div');
disabledImageZone.setAttribute('id', 'disabledImageZone');
disabledImageZone.style.position = "absolute";
disabledImageZone.style.zIndex = "1000";
disabledImageZone.style.left = "0px";
disabledImageZone.style.top = "0px";
disabledImageZone.style.width = "100%";
disabledImageZone.style.height = "100%";
var imageZone = document.createElement('img');
imageZone.setAttribute('id','imageZone');
imageZone.setAttribute('src',imageSrc);
imageZone.style.position = "absolute";
imageZone.style.top = "0px";
imageZone.style.right = "0px";
disabledImageZone.appendChild(imageZone);
document.body.appendChild(disabledImageZone);
}
else {
$('imageZone').src = imageSrc;
disabledImageZone.style.visibility = 'visible';
}
});
DWREngine.setPostHook(function() {
$('disabledImageZone').style.visibility = 'hidden';
});
}
然后修改body中的init()函数
function init() {
useLoadingImage("iframe/U1751P410T11D5F84DT20061207163706.jpg");
}
2.不能在body中加init()时,可用下面的方法
<script>
function init() {
DWRUtil.useLoadingMessage();
}
if (window.addEventListener) {
window.addEventListener("load", init, false);
}
else if (window.attachEvent) {
window.attachEvent("onload", init);
}
else {
window.onload = init;
}
</script>
3.实现自定义加载信息
function useLoadingMessage(message) {
var loadingMessage;
if (message) loadingMessage = message;
else loadingMessage = "Loading";
DWREngine.setPreHook(function() {
var disabledZone = $('disabledZone');
if (!disabledZone) {
disabledZone = document.createElement('div');
disabledZone.setAttribute('id', 'disabledZone');
disabledZone.style.position = "absolute";
disabledZone.style.zIndex = "1000";
disabledZone.style.left = "0px";
disabledZone.style.top = "0px";
disabledZone.style.width = "100%";
disabledZone.style.height = "100%";
document.body.appendChild(disabledZone);
var messageZone = document.createElement('div');
messageZone.setAttribute('id', 'messageZone');
messageZone.style.position = "absolute";
messageZone.style.top = "100px"; //定义显示加载信息层的位置
messageZone.style.left = "400px"; //定义显示加载信息层的位置
messageZone.style.width = "200"; //定义显示加载信息层的宽度
messageZone.style.height = "50"; //定义显示加载信息层的高度
messageZone.style.background = "green";//定义显示加载信息层的颜色
messageZone.style.color = "white";
messageZone.style.fontFamily = "Arial,Helvetica,sans-serif";
messageZone.style.padding = "4px";
disabledZone.appendChild(messageZone);
var text = document.createTextNode(loadingMessage);
messageZone.appendChild(text);
}
else {
$('messageZone').innerHTML = loadingMessage;
disabledZone.style.visibility = 'visible';
}
});
DWREngine.setPostHook(function() {
$('disabledZone').style.visibility = 'hidden';
});
}
在提供信息文字时,可以传递“<div align=center><font color=#FF99FF size=5>闹闹爱</font></div>”为信息,不过第一次显示的是代码,并不能居中及字体大小、颜色。
相关文章推荐
- 又是dwr,这回让我郁闷的是DWRUtil.useLoadingMessage
- easyui 使用loading"正在加载..." 风格的加载提示信息
- (转)DWR util.js工具包的使用
- hibernate中使用MyEclipse工具时,加载数据库的配置信息时候,当加载数据库的驱动时测试不成功
- 简单使用WCF MessageHeader传递信息
- 使用Adsutil.vbs脚本获取IIS配置信息及账号密码
- 使用c#,WPF,模仿IPhone的Loading(加载)效果
- 当使用restore .bak文件的时候.显示如信息:Use WITH MOVE to identify a valid location for the file
- IOS使用MessageUI Framework 发送短信息
- vue-cli项目中使用公用的提示弹层tips或加载loading组件实例详解
- 使用Properties的load方法加载属性信息
- DWR util.js工具包的使用
- 使用Adsutil.vbs脚本获取IIS配置信息及账号密码
- 使用jquery实现页面滚动到底部自动加载新的信息
- DWR util.js工具包的使用
- 使用java.util.Calendar来取得相关日期信息
- 使用 DWR 的 util.js 进行数据回显
- java.util.Arrays.asList使用体会
- 使用 #pragma message 输出自定义警告信息