JS实现 页面提交防刷新等待提示
//关闭等待窗口
function closediv() {
//Close Div
document.body.removeChild(document.getElementById("bgDiv"));
document.getElementById("msgDiv").removeChild(document.getElementById("msgTitle"));
document.body.removeChild(document.getElementById("msgDiv"));
}
//显示等待窗口
function showdiv(str) {
var msgw, msgh, bordercolor;
msgw = 400; //提示窗口的宽度
msgh = 100; //提示窗口的高度
bordercolor = "#336699"; //提示窗口的边框颜色
titlecolor = "#99CCFF"; //提示窗口的标题颜色 var sWidth, sHeight;
sWidth = window.screen.availWidth;
sHeight = window.screen.availHeight; var bgObj = document.createElement("div");
bgObj.setAttribute('id', 'bgDiv');
bgObj.style.position = "absolute";
bgObj.style.top = "0";
bgObj.style.background = "#777";
bgObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
bgObj.style.opacity = "0.6";
bgObj.style.left = "0";
bgObj.style.width = sWidth + "px";
bgObj.style.height = sHeight + "px";
document.body.appendChild(bgObj);
var msgObj = document.createElement("div")
msgObj.setAttribute("id", "msgDiv");
msgObj.setAttribute("align", "center");
msgObj.style.position = "absolute";
msgObj.style.background = "white";
msgObj.style.font = "12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";
msgObj.style.border = "1px solid " + bordercolor;
msgObj.style.width = msgw + "px";
msgObj.style.height = msgh + "px";
msgObj.style.top = (document.documentElement.scrollTop + (sHeight - msgh) / 2) + "px";
msgObj.style.left = (sWidth - msgw) / 2 + "px";
var title = document.createElement("h4");
title.setAttribute("id", "msgTitle");
title.setAttribute("align", "right");
title.style.margin = "0";
title.style.padding = "3px";
title.style.background = bordercolor;
title.style.filter = "progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";
title.style.opacity = "0.75";
title.style.border = "1px solid " + bordercolor;
title.style.height = "18px";
title.style.font = "12px Verdana, Geneva, Arial, Helvetica, sans-serif";
title.style.color = "white";
//title.style.cursor = "pointer";
//title.innerHTML = "关闭";
//title.onclick = closediv;
document.body.appendChild(msgObj);
document.getElementById("msgDiv").appendChild(title);
var txt = document.createElement("p");
txt.style.margin = "1em 0"
txt.setAttribute("id", "msgTxt");
txt.innerHTML = str;
document.getElementById("msgDiv").appendChild(txt);
}
//屏蔽F5
document.onkeydown = mykeydown;
function mykeydown() {
if (event.keyCode == 116) //屏蔽F5刷新键
{
window.event.keyCode = 0;
return false;
}
}
使用页面直接调用这个js文件,然后在按钮的onclick事件中填写:
<INPUT onclick="showdiv('表达数据提交中<br/>请稍候........ <br/> );" type="button" value="提交数据">
调用closediv()关闭
JS实现 页面提交防刷新等待提示的更多相关文章
- 竖向折叠二级导航JS代码(可防刷新ul/li结构)
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> ...
- ExtJs 4中 Ext.Ajax.request提交实现waitMsg等待提示效果
//submitForm为form表单 var myMask = new Ext.LoadMask(Ext.getBody(),{msg:"请稍等,正在导入..."}); myMa ...
- js实现操作等待提示loading……
js实现操作等待功能,防止重复提交,界面友好,底部为灰色遮罩层,防止用户重复操作. 先看效果图: 接着看js代码: //关闭等待窗口 function closeWaiting() { var b ...
- JS 重载页面,本地刷新,返回上一页
JS 重载页面,本地刷新,返回上一页 : <a href="javascript:history.go(-1)">返回上一页</a> <a href= ...
- form表单提交数据,页面必定会刷新,ajax提交数据不会刷新,做到悄悄提交,多选删除,ajax提交实例
很多页面用到的模态对话框,如知明网站https://dig.chouti.com/的登录页都是模态对话框, 当点登录时,是用的ajax提交,因为输入错了信息,有返回消息,而页面没有刷新. jquery ...
- JS实现页面刷新方法
下面介绍全页面刷新方法:有时候可能会用到 window.location.reload()刷新当前页面. parent.location.reload()刷新父亲对象(用于框架) opener.loc ...
- 不使用Ajax,如何实现表单提交不刷新页面
不使用Ajax,如何实现表单提交不刷新页面? 目前,我想到的是使用<iframe>,如果有其他的方式,后续再补. 举个栗子: 在表单上传文件的时候必须设置enctype="mul ...
- js中页面刷新和页面跳转的方法总结
.js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...
- js中页面刷新和页面跳转的方法总结 [ 转自欢醉同学 ]
.js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...
随机推荐
- Spring MVC 学习笔记 data binding
最近在实验Spring的时候遇到了一个问题: SEVERE: Servlet.service() for servlet [DispatcherServlet] in context with ...
- eclipse中设置中文javadoc+如何查看class的中文javadoc
一. eclipse中设置中文javadoc 1.先到http://download.java.net/jdk/jdk-api-localizations/jdk-api-zh-cn/publish ...
- HTTP message vs SOAP message
HTTP Message / SOAP Message HTTP Message ===>包括Request, Response.我们主要关注的是 HTTP Message,这样子包含的范围会更 ...
- ajax 技术和原理分析
ajax所包含的技术 大家都知道ajax并非一种新的技术,而是几种原有技术的结合体.它由下列技术组合而成. 1.使用CSS和XHTML来表示. 2. 使用DOM模型来交互和动态显示. 3.使用XMLH ...
- DB2 的create or update方法
通过merge方法实现的: MERGE INTO IFEBASE.STYLE AS MT USING (SELECT :scenario AS SCENARIO_ID, :style AS SHAPE ...
- MYSQL注入天书之后记
后记 对于工具的看法: 我之所以在每个例子中只写了几个示例,是因为我希望你能通过这一两个示例举一反三将其他的列出来.如果让我来完成每一次完整的注入,应该在知道原理的情况下,必然使用工具或者自己写代码实 ...
- jQuery对象和javascript对象互换
jquery变js var obj=$("dom"); 或 var obj=jQuery("dom"); js 变 jquery var $jobj=$(obj ...
- main函数和启动例程
为什么汇编程序的入口是_start,而C程序的入口是main函数呢?本节就来解释这个问题.在讲例 18.1 “最简单的汇编程序”时,我们的汇编和链接步骤是: $ as hello.s -o hello ...
- 刘汝佳 算法竞赛-入门经典 第二部分 算法篇 第五章 2(Big Number)
这里的高精度都是要去掉前导0的, 第一题:424 - Integer Inquiry UVA:http://uva.onlinejudge.org/index.php?option=com_onlin ...
- iOS多线程的初步研究(十)-- dispatch同步
GCD提供两种方式支持dispatch队列同步,即dispatch组和信号量. 一.dispatch组(dispatch group) 1. 创建dispatch组 dispatch_group_t ...