本文介绍两种使用JavaScript防止表单重复提交的方法。第一种通过全局Flag标识控制提交状态,提交后禁用按钮或返回false;第二种利用时间戳计算提交间隔,设定如5分钟内的冷却期。前者简单直接,后者需处理隐藏字段,刷新页面可能失效。建议前后端结合使用以确保安全。
Flag标识控制法
第一种方法是通过设置一个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检测,无需额外的权限支持。至于效果如何,用不用由用户决定(建议前后端都加上检测)。