防止表单重复提交-01

2021-02-05 09:04:26 阅读：77 来源： 互联网

使用华丹智能web报表快速开发平台开发项目过程中，由于选择数据过多或者网络问题，提交表单时候需要一定的运行时间，这时候，客户经常会觉得是不是自己没有点提交按钮，就又会再点一次，这样极容易造成数据重复。下面介绍几种防止表单提交的方法，
1、首先创建一个表单，代码如下：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html>
	<head>
		<title>学生表单</title>
	</head>

	<body>
		<form action="servlet/addStudent" method="post">
			班级：<input type="text" name="classroom">
			姓名：<input type="text" name="stuname">
			性别：<input type="text" name="sex">
			年龄：<input type="text" name="age">
			
			<input type="submit" value="提交" id="submit">
		</form>
	</body>
</html>

2、发生重复提交的情况
（1）连续单击
（2）页面刷新
（3）使用浏览器返回功能返回上一页后再前进回来

3、解决方案
（1）使用js提交的时候讲按钮设置为不可用。代码如下

<script>
		function dosubmit(){
			//获取表单提交按钮
			var btnSubmit = document.getElementById("submit");
			//将表单提交按钮设置为不可用，这样就可以避免用户再次点击提交按钮
			btnSubmit.disabled= "disabled";
			//返回true让表单可以正常提交
			return true;
		}
	</scrpt>

效果缺点：提交后客户会有疑惑这是怎么了，为什么按钮不能用了

（2）使用js在提交的时候，设置一个变量，判断是否提交了。代码如下：

<script>
	var isSubmit = 0;
	function dosubmit(){
		if(isSubmit==0){
			isSubmit = 1;
			//返回true让表单可以正常提交
			return true;
		}else{
			//返回false让表单不提交
			return false;
		}
	}
</scrpt>

（3）使用js提交将按钮隐藏，功能类似于禁用按钮，代码略

华丹智能WEB报表快速开发平台的确很好用，有兴趣也可以看一下，网址https://www.huadaninfo.com/

标签：01,表单,提交,按钮,isSubmit,js,true
来源： https://blog.csdn.net/HD_2020176257/article/details/113675089

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

防止表单重复提交-01