JS实现 页面提交防刷新等待提示 .

01.//关闭等待窗口   
02.function closediv() {  
03.    //Close Div    
04.    document.body.removeChild(document.getElementById("bgDiv"));  
05.    document.getElementById("msgDiv").removeChild(document.getElementById("msgTitle"));  
06.    document.body.removeChild(document.getElementById("msgDiv"));  
07.}  
08.//显示等待窗口   
09.function showdiv(str) {  
10.    var msgw, msgh, bordercolor;  
11.    msgw = 400; //提示窗口的宽度    
12.    msgh = 100; //提示窗口的高度    
13.    bordercolor = "#336699"; //提示窗口的边框颜色    
14.    titlecolor = "#99CCFF"; //提示窗口的标题颜色    
15.  
16.    var sWidth, sHeight;  
17.    sWidth = window.screen.availWidth;  
18.    sHeight = window.screen.availHeight;  
19.  
20.    var bgObj = document.createElement("div");  
21.    bgObj.setAttribute('id', 'bgDiv');  
22.    bgObj.style.position = "absolute";  
23.    bgObj.style.top = "0";  
24.    bgObj.style.background = "#777";  
25.    bgObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";  
26.    bgObj.style.opacity = "0.6";  
27.    bgObj.style.left = "0";  
28.    bgObj.style.width = sWidth + "px";  
29.    bgObj.style.height = sHeight + "px";  
30.    document.body.appendChild(bgObj);  
31.    var msgObj = document.createElement("div")  
32.    msgObj.setAttribute("id", "msgDiv");  
33.    msgObj.setAttribute("align", "center");  
34.    msgObj.style.position = "absolute";  
35.    msgObj.style.background = "white";  
36.    msgObj.style.font = "12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";  
37.    msgObj.style.border = "1px solid " + bordercolor;  
38.    msgObj.style.width = msgw + "px";  
39.    msgObj.style.height = msgh + "px";  
40.    msgObj.style.top = (document.documentElement.scrollTop + (sHeight - msgh) / 2) + "px";  
41.    msgObj.style.left = (sWidth - msgw) / 2 + "px";  
42.    var title = document.createElement("h4");  
43.    title.setAttribute("id", "msgTitle");  
44.    title.setAttribute("align", "right");  
45.    title.style.margin = "0";  
46.    title.style.padding = "3px";  
47.    title.style.background = bordercolor;  
48.    title.style.filter = "progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";  
49.    title.style.opacity = "0.75";  
50.    title.style.border = "1px solid " + bordercolor;  
51.    title.style.height = "18px";  
52.    title.style.font = "12px Verdana, Geneva, Arial, Helvetica, sans-serif";  
53.    title.style.color = "white";  
54.    //title.style.cursor = "pointer";   
55.    //title.innerHTML = "关闭";   
56.    //title.onclick = closediv;   
57.    document.body.appendChild(msgObj);  
58.    document.getElementById("msgDiv").appendChild(title);  
59.    var txt = document.createElement("p");  
60.    txt.style.margin = "1em 0"  
61.    txt.setAttribute("id", "msgTxt");  
62.    txt.innerHTML = str;  
63.    document.getElementById("msgDiv").appendChild(txt);  
64.}  
65.//屏蔽F5   
66.document.onkeydown = mykeydown;  
67.function mykeydown() {  
68.    if (event.keyCode == 116) //屏蔽F5刷新键      
69.    {  
70.        window.event.keyCode = 0;  
71.        return false;  
72.    }  
73.}    
直接在页面调用showdiv(str)即可, 或者在点击按钮时触发<input type="button" οnclick="showdiv('数据提交中,请稍等')"/>
 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值