from: http://lotuslive.blogdriver.com/lotuslive/1180945.html
其實DWRUtil.useLoadingImage使用的是DWREngine的鉤子,設置了PreHook()和PostHook()。
DWREngine.setPreHook(function)在調用DWR之前,運行function函數。DWREngine.setPostHook(function)在調用完DWR后,運行function函數。所以我們可以用它來顯示程序運行時的動畫效果,并可以解決表單重復提交的問題。例如:點擊提交按鈕后,就把按鈕隱藏,后臺程序運行完畢后,再把按鈕顯示出來。為此目的,下面修改了DWRUtil.useLoadingImage代碼:
/**
* 使用loading image,并且還可以隱藏按鈕
* @param imageSrc 圖像地址
* @param item 要隱藏的html item對象數組
* @author huangqiao
* @date 2006-5-11
*/
DWRUtil.useLoadingImage = function(imageSrc,items) {
var loadingImage;
if (imageSrc) loadingImage = imageSrc;
else loadingImage = "ajax-loader.gif";
DWREngine.setPreHook(function() {
if(items != null) {
for(var i=0; i<items.length; i++)
items[i].style.visibility = 'hidden';
}
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() {
if(items != null) {
for(var i=0; i<items.length; i++)
items[i].style.visibility = 'visible';
}
$('disabledImageZone').style.visibility = 'hidden';
});
};
使用方法,在頁面加載時就調用此函數:
DWRUtil.useLoadingImage("images/loader.gif",[$("buttonId_1"),$("buttonId_2")]);
當調用DWR時,就會顯示加載圖片,并將id為"buttonId_1"和"buttonId_2"的按鈕隱藏;調用結束后,隱藏加載圖片,并將已隱藏的按鈕再次顯示出來。
如果不想隱藏按鈕,直接使用DWRUtil.useLoadingImage("images/loader.gif")即可。注意的是:DWRUtil.useLoadingImage只需調用一次就可設置DWR引擎的鉤子,在同個頁面中不需再多次調用。
posted on 2008-07-17 10:50
henry1451 閱讀(318)
評論(0) 編輯 收藏