防止表单重复提交的方法总体来说有两种,一种是在js中阻止重复提交;另一种是在后台利用token令牌实现,大致思路是生成一个随机码放到session和form表单的隐藏输入框中,提交表单时两者对比,表单处理完毕清空或者修改session中的token。

在js中处理简单易懂,同时能解决我现在所做的项目中的问题,目前暂用js处理,后期如有需要再研究token机制。代码如下:

1、表单提交后禁用提交按钮(在本项目中表单提交完成后,如果处理成功都把form表单关掉了)

 /**
* form表单格式验证通过之后、表单提交前将提交按钮禁用(注意顺序)
* @param submitBtnId 提交按钮ID
* @param btnType 按钮类型 'button'或者'linkbutton'
* @returns {Boolean}
*/
function disableSubmitBtn(submitBtnId, btnType){
if(btnType == 'button'){
$("#"+submitBtnId).attr("disabled","disabled");
}else if(btnType == 'linkbutton'){
$("#"+submitBtnId).linkbutton('disable');
}
return true;
}

由于在项目中有用到普通button和easyUI的linkbutton两种按钮,而禁用这两种按钮的方法不同,所以需要多传一个参数btnType(按钮类型)

2、如果提交表单失败则启用按钮,以便用户修改内容后再次提交

 /**
* form表单提交失败后将提交按钮开启,以便用户修改数据后再次提交
* @param submitBtnId 提交按钮ID
* @param btnType 按钮类型 'button'或者'linkbutton'
* @returns {Boolean}
*/
function enableSubmitBtn(submitBtnId, btnType){
if(btnType == 'button'){
$("#"+submitBtnId).removeAttr("disabled");
}else if(btnType == 'linkbutton'){
$("#"+submitBtnId).linkbutton('enable');
}
return true;
}

3、在每次表单提交时调用这两个方法,具体放的位置根据实际业务逻辑而定

js阻止form表单重复提交的更多相关文章

  1. JavaWeb学习总结(十一):Session解决form表单重复提交

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  2. php 解决和避免form表单重复提交的方法

    在提交表单的时候,可能遇到网速等导致页面突然加载变慢,用户重复地点击提交按钮,将在数据库产生多条数据,导致不可控情况. 比如下面的情况就会导致表单重复提交: 点击提交按钮两次. 点击刷新按钮. 使用浏 ...

  3. form表单重复提交,type=“button”和type=“submit”区别

    公司测试提了一个项目后台在IE浏览器下(360,firefox就没问题)出现数据重复的问题,调试了好久终于发现问题所在,也不知道是谁写的代码,醉醉的.... 错误地点: <input type= ...

  4. easyUI的form表单重复提交处理

    1. 问题 生产环境出现过新增用户提交, 入库两条重复数据的情况; 但是我查看代码, 页面做了校验, 后台插入数据也做了校验;  出现这种几率的事件的非常小的, 但是还是会碰到, 客户会对我们的产品产 ...

  5. js 模拟form表单post提交

    var generateHideElement = function (name, value) { var tempInput = document.createElement("inpu ...

  6. 防止表单提交时刷新页面-阻止form表单的默认提交行为

    最近在写 ajax 提交的时候遇到一个问题,在执行 ajax 提交之后,浏览器页面自动刷新了,主要是没有 由于form 表单的默认提交行为.一下是几种阻止 form 表单默认提交行为的方式. 1.使用 ...

  7. 基于form表单submit提交不跳转

    方法一:target <html> <body> <form action="" method="post" target=&qu ...

  8. java web学习总结(十三) -------------------使用Session防止表单重复提交

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  9. JavaWeb防止表单重复提交(转载)

    转载自:http://blog.csdn.net/ye1992/article/details/42873219 在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用 ...

随机推荐

  1. hibernate学习(5)——多对多关系映射

    1.创建实体和映射 package com.alice.hibernate03.vo; import java.util.HashSet; import java.util.Set; public c ...

  2. GridView实现方块布局

    效果如下: 先创建一个BaseViewHolder package com.example.griddemo; import android.util.SparseArray; import andr ...

  3. java类初始化的过程

    在复习Thinking in java的过程中看到了相关内容,顺便整理一下,像下面一样的代码具体的执行顺序(ABCD都是类) public class A { public A(String text ...

  4. Javascript基础知识总结一

    Javascript基础知识总结一 <!DOCTYPE html> <html> <head lang="en"> <meta chars ...

  5. jqurey datatable mRender FnRender 不起作用问题

    用这个插件的   知道他不起作用,就应该知道他是做什么的了吧,我的不起作用的原因是版本的问题 我在网上查找的用法 是 "fnRender":fuction(obj){} 可是不起作 ...

  6. JavaNote01_变量 基本数据类型

    >主要内容: 变量的初始化.赋值.读写操作 8中基本数据类型(取值范围).整数的直接量(字面量)是哪种类型.浮点数的字面量是哪种类型 >变量 >>声明变量:开启一个存储单元,用 ...

  7. 【转】Apache Digest验证

    Apache默认使用basic模块验证,都是明文传输,不太安全,所以本文使用Digest来验证,以提高安全性. 1.Apache配置: A.目录权限配置 Alias /nagios "/us ...

  8. web前端基础知识 jQuery

    通过之前的学习我们已经了解了html.css.javascript的相关知识:本次我们就共同学习进阶知识:jQuery~ 一.什么是jQuery? jQuery其实就是一个轻量级的javascript ...

  9. Model Validation in ASP.NET Web API By Mike Wasson|July 20, 2012 268 of 294 people found this helpful

    using System.Collections.Generic; using System.Linq; using System.Net; using System.Net.Http; using ...

  10. C#,C++修改vs文件模板,添加自定义代码版权版本信息

    简单型的修改类似该路径下的模板文件即可(vs版本或安装路径不同路径可能不同) C#: 模板参数参考https://msdn.microsoft.com/zh-cn/library/eehb4faa.a ...