//关闭等待窗口
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实现 页面提交防刷新等待提示的更多相关文章

  1. 竖向折叠二级导航JS代码(可防刷新ul/li结构)

    <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    ...

  2. ExtJs 4中 Ext.Ajax.request提交实现waitMsg等待提示效果

    //submitForm为form表单 var myMask = new Ext.LoadMask(Ext.getBody(),{msg:"请稍等,正在导入..."}); myMa ...

  3. js实现操作等待提示loading……

    js实现操作等待功能,防止重复提交,界面友好,底部为灰色遮罩层,防止用户重复操作. 先看效果图:   接着看js代码: //关闭等待窗口 function closeWaiting() { var b ...

  4. JS 重载页面,本地刷新,返回上一页

    JS 重载页面,本地刷新,返回上一页 : <a href="javascript:history.go(-1)">返回上一页</a> <a href= ...

  5. form表单提交数据,页面必定会刷新,ajax提交数据不会刷新,做到悄悄提交,多选删除,ajax提交实例

    很多页面用到的模态对话框,如知明网站https://dig.chouti.com/的登录页都是模态对话框, 当点登录时,是用的ajax提交,因为输入错了信息,有返回消息,而页面没有刷新. jquery ...

  6. JS实现页面刷新方法

    下面介绍全页面刷新方法:有时候可能会用到 window.location.reload()刷新当前页面. parent.location.reload()刷新父亲对象(用于框架) opener.loc ...

  7. 不使用Ajax,如何实现表单提交不刷新页面

    不使用Ajax,如何实现表单提交不刷新页面? 目前,我想到的是使用<iframe>,如果有其他的方式,后续再补. 举个栗子: 在表单上传文件的时候必须设置enctype="mul ...

  8. js中页面刷新和页面跳转的方法总结

    .js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...

  9. js中页面刷新和页面跳转的方法总结 [ 转自欢醉同学 ]

    .js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...

随机推荐

  1. .NET设计模式(18):迭代器模式(Iterator Pattern)(转)

    概述 在面向对象的软件设计中,我们经常会遇到一类集合对象,这类集合对象的内部结构可能有着各种各样的实现,但是归结起来,无非有两点是需要我们去关心的:一是集合内部的数据存储结构,二是遍历集合内部的数据. ...

  2. logback日志配置文件代码示例

    <?xml version="1.0" encoding="UTF-8"?> <configuration scan="true&q ...

  3. 异步等待的 Python 协程

    现在 Python 已经支持用协程进行异步处理.但最近有建议称添加协程以全面完善 Python 的语言结构,而不是像现在这样把他们作为生成器的一个类型.此外,两个新的关键字---异步(async)和等 ...

  4. HTML5程序设计--SVG

    SVG(Scalable Vector Graphics):可缩放矢量图形,一种二维图形表示语言. 借助SVG,我们可以实现很多同Canvas API类型的绘制操作,但在Canvas元素上绘制文本的时 ...

  5. SPOJ375 Query on a tree(LCT边权)

    之前做了两道点权的LCT,这次做一下边权的LCT.上网找了一下资料,发现对于边权的LCT有这么两种处理方法,一种是每条边建一个点,于是边权就转成点权了.另外一种则是每个边权对应到点权上,也就是每个点对 ...

  6. KMP模板,最小循环节

    (可以转载,但请注明出处!) 下面是有关学习KMP的参考网站 http://blog.csdn.net/yaochunnian/article/details/7059486 http://blog. ...

  7. 【hadoop】有参考价值的博客整理

    好文章的网址: hadoop shuffle机制中针对中间数据的排序过程详解(源代码级) Hadoop mapreduce原理学习 与 Hadoop 对比,如何看待 Spark 技术? 深入理解Had ...

  8. 加载gif动态图的三种方式

    准备:本地图片资源,GifView

  9. 有了 Docker,用 JavaScript 框架开发的 Web 站点也能很好地支持网络爬虫的内容抓取

    点这里 阅读目录 用 AngularJS(以及其它 JavaScript 框架)开发的 Web 站点不支持爬虫的抓取 解决方案 为什么公开我们的解决方案 实现 AngularJS 服务 结论   Pr ...

  10. Javascript 正则表达式_5

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...