js防止表单重复提交的两种方法


Posted in Javascript onSeptember 30, 2013

第一种:用flag标识,下面的代码设置checkSubmitFlg标志:

<script language="”javascript”"> var checkSubmitFlg = false; 
function checkSubmit(){ 
if(checkSubmitFlg ==true){ return false; //当表单被提交过一次后checkSubmitFlg将变为true,根据判断将无法进行提交。 
} 
checkSubmitFlg ==true; 
return true; 
} 
< /script > 
< form name=”form1” method=”post” onsubmit=”return checkSubmit();”> 
………..< /form>

第二种:在onsubmit事件中设置,在第一次提交后使提交按钮失效,代码如下:
<form action=”about:blank” method=”post” onsubmit =”getElementById(‘submitInput').disabled=true;return true;” target=”_blank”> 
<input type=”submit” id=”submitInput”/> 
</form> 
</body> 
</html> 
</script>

因为程序源码跟WIN2000的注册表有冲突,帖子发出后会出现无效页面,以致于论坛里有很多无恶意的重复帖子,后来想出了一个办法,用JS避免重复提交,下面是部分源码:
<script Language='JavaScript'> 
function formsubmit() { 
Today = new Date(); 
var NowHour = Today.getHours(); 
var NowMinute = Today.getMinutes(); 
var NowSecond = Today.getSeconds(); 
var mysec = (NowHour*3600)+(NowMinute*60)+NowSecond; 
if((mysec-document.formsubmitf.mypretime.value)>600) 
//600只是一个时间值,就是5分钟内禁止重复提交,值随你高兴设 
{ 
document.formsubmitf.mypretime.value=mysec; 
} 
else 
{ 
alert(' 按一次就够了,请勿重复提交!请耐心等待!谢谢合作!'); 
return false; 
} 
document.forms.formsubmitf.submit(); 
} 
</script> </HEAD> 
<BODY BGCOLOR="#FFFFFF"> 
<form name=formsubmitf id ="the" method="post" action="XXX.asp"> 
<input type=hidden name='mypretime' value='0'> //这句不能少,用隐含变量传递一个时间初值 
//这里是你要提交的内容 
<input type="button" value="写好了" name="button1" class="4round" onclick='formsubmit()'> <font class="red">(请按一次,耐心等待!)</font> <input type="reset" value="重 写" name="button2" class="4round"> 
</form>

用了这个代码,论坛的重复帖子明显减少,不过有个缺点,就是刷新一次,检测就不起作用,好处就是利用JS检测,不需要额外的权限支持,至于效果如何,用不用就随你们了,(最好前端跟后端都加上检测)
Javascript 相关文章推荐
JQuery 构建客户/服务分离的链接模型中Table分页代码效率初探
Jan 22 Javascript
js常用代码段整理
Nov 30 Javascript
JS写的贪吃蛇游戏(个人练习)
Jul 08 Javascript
JS给超链接加确认对话框的方法
Feb 24 Javascript
jquery实现键盘左右翻页特效
Apr 30 Javascript
分享我的jquery实现下拉菜单心的
Nov 29 Javascript
vue.js选中动态绑定的radio的指定项
Jun 02 Javascript
原生JS forEach()和map()遍历的区别、兼容写法及jQuery $.each、$.map遍历操作
Feb 27 jQuery
Vue组件系列开发之模态框
Apr 18 Javascript
文章或博客自动生成章节目录索引(支持三级)的实现代码
May 10 Javascript
如何利用JavaScript实现二叉搜索树
Apr 02 Javascript
vue如何使用模拟的json数据查看效果
Mar 31 Vue.js
js借助ActiveXObject实现创建文件
Sep 29 #Javascript
js获取URL的参数的方法(getQueryString)示例
Sep 29 #Javascript
在父页面调用子页面的JS方法
Sep 29 #Javascript
javascript完美拖拽的实现方法
Sep 29 #Javascript
jquery中focus()函数实现当对象获得焦点后自动把光标移到内容最后
Sep 29 #Javascript
js中的scroll和offset 使用比较的实例与分析
Sep 29 #Javascript
jquery判断RadioButtonList和RadioButton中是否有选中项示例
Sep 29 #Javascript
You might like
文件上传类
2006/10/09 PHP
php获取指定日期之间的各个周和月的起止时间
2014/11/24 PHP
使用php的HTTP请求的库Requests实现美女图片墙
2015/02/22 PHP
php 解决扫描二维码下载跳转问题
2017/01/13 PHP
JavaScript 学习笔记一些小技巧
2010/03/28 Javascript
js自动闭合html标签(自动补全html标记)
2012/10/04 Javascript
关闭页面window.location事件未执行的原因及解决方法
2014/09/01 Javascript
JS实现仿京东淘宝竖排二级导航
2014/12/08 Javascript
JS获取Table中td值的方法
2015/03/19 Javascript
Bootstrap实现响应式导航栏效果
2015/12/28 Javascript
微信小程序中form 表单提交和取值实例详解
2017/04/20 Javascript
在vue中添加Echarts图表的基本使用教程
2017/11/22 Javascript
Vuex提升学习篇
2018/01/11 Javascript
Node.js之readline模块的使用详解
2019/03/25 Javascript
微信小程序开发实现消息推送
2020/11/18 Javascript
详解element-ui中el-select的默认选择项问题
2019/08/02 Javascript
如何区分vue中的v-show 与 v-if
2020/09/08 Javascript
[15:28]DOTA2 HEROS教学视频教你分分钟做大人-剧毒术士
2014/06/13 DOTA
Python ORM框架SQLAlchemy学习笔记之安装和简单查询实例
2014/06/10 Python
python根据给定文件返回文件名和扩展名的方法
2015/03/27 Python
Python的Django框架中TEMPLATES项的设置教程
2015/05/29 Python
pyenv命令管理多个Python版本
2017/03/26 Python
python虚拟环境的安装配置图文教程
2017/10/20 Python
对python使用telnet实现弱密码登录的方法详解
2019/01/26 Python
Python QQBot库的QQ聊天机器人
2019/06/19 Python
django之静态文件 django 2.0 在网页中显示图片的例子
2019/07/28 Python
专业销售业务员求职信
2013/11/18 职场文书
物流管理专业自荐信
2014/06/23 职场文书
欢迎领导检查标语
2014/06/27 职场文书
人力资源管理毕业求职信
2014/08/05 职场文书
财务人员岗位职责
2015/02/03 职场文书
酒店销售经理岗位职责
2015/04/02 职场文书
2015年度女工工作总结
2015/10/22 职场文书
校运会班级霸气口号
2015/12/24 职场文书
2016简历自荐信优秀范文
2016/01/29 职场文书
导游词之黄帝陵景区
2019/09/16 职场文书