使用js控制表单重复提交（1加锁，2事件方式，3 EasyUI中解决表单重复提交）

2024-04-19 19:18
文章标签 使用 表单 js 解决 方式 重复 事件 提交 控制 加锁 easyui

本文主要是介绍使用js控制表单重复提交（1加锁，2事件方式，3 EasyUI中解决表单重复提交），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！ 

方法一、
var flag = true;
$(function() {$("#interested").click(function() {beInterested();});
});function beInterested() {//$("#interested").unbind("click");if (!flag) {alert("已感兴趣!");return;}if (flag) {var newNum = parseInt($("#beInterestedVal").attr("value"));// 点击之后就立即改变值$("#beInterestedVal").attr("value", newNum + 1);$("#beInterestedVal").text(newNum + 1);flag = false;}var copyrightid = $("#copyrightid").val();jQuery.ajax({type : 'POST',url : "/cartoon-web/copyRight/beInterestedIn",data : {"cid" : copyrightid},dataType : 'json',success : function(data) {if (data.result == 'success') {flag = false;// 设置设置不可以再点击// $("#interested").unbind("click");// alert("修改数据成功，要改变样式，不让此点再次点击!");} else {flag = true;alert(data.msg);}},error : function(XMLHttpRequest, textStatus, errorThrown) {alert("网络或者其它原因导致的错误!");flag = true;}});
}

方法二、

 

$("#publicCopyRight").click(function() {var b = validator.form();if (b == true) {submitForm();}});
var lock = true;
function submitForm() {var cid = $("#copyrightForm #cid").attr("value");/* 版权方名称 */var copyRightName = $("#copyRightName").val();/* 联系方式 */var contact = $("#contact").val();/* 作品名称 */var worksName = $("#worksName").val();/* 作品类别 */var worksCategory = $("#worksCategory").val();if (worksCategory == "请选择...") {worksCategory = "";}console.log("worksCategory = " + worksCategory);/* 授权价格 */var price = $("#price").val();/* 作品介绍 */var worksInfo = $(document.getElementsByTagName('iframe')[0].contentWindow.document.body).html();// alert(worksInfo);/* 授权范围 */var auScope = $("#auScope").val();/* 授权期限 */var auDeadLine = $("#auDeadLine").val();/* 本信息有效期限 */var termOfValidity = $('input[name="termOfValidity"]:checked').val();/* 表示是否同意的标识 *///console.log(document.getElementById("agreeFlag").checked);var agreeFlag = (document.getElementById("agreeFlag").checked == true) ? 1 : 0;if(agreeFlag == 0) {lock = false;alert("对不起，您得先同意酷漫网相关法律声明才可以发布版权信息!");$("#low-declare").css("color","red");} else {lock = true;$("#low-declare").css("color","#2d3e53");}/* 获取图片上传的路径 */var copyRightImage = $("#posterUrl").val();if (lock == true) {$("#publicCopyRight").unbind("click");lock = false;jQuery.ajax({type : 'post',url : url,data : {"cid" : cid,"copyRightName" : copyRightName,"contact" : contact,"worksName" : worksName,"worksCategory" : worksCategory,"price" : price,"worksInfo" : worksInfo,"auScope" : auScope,"auDeadLine" : auDeadLine,"termOfValidity" : termOfValidity,"agreeFlag" : agreeFlag,"copyRightImage" : copyRightImage,"mark" : "publishyes"},contentType : "application/x-www-form-urlencoded; charset=utf-8",dataType : 'json',success : function(data) {if (data.result == 'success') {// 成功之后还是不让提交，直接等待跳转。//console.log("/cartoon-web/copyRight/toPreviewPage?cid=" + data.cid);window.location = "/cartoon-web/copyRight/toPreviewPage?cid=" + data.cid;} else if (data.result == "fail") {alert(data.msg);lock = true;$("#publicCopyRight").bind("click",function() {submitForm();});}},error : function(XMLHttpRequest, textStatus, errorThrown) {alert("网络或者其它原因导致的错误!");lock = true;$("#publicCopyRight").bind("click",function() {submitForm();});}});}
}


EasyUI中解决表单重复提交(主要看Add)：

/** name       :Zuoquan Tu* mail       :tuzq@XXXXX.cn* date       :2015/06/30* version    :1.1* description:modified by tuzuoquan 2015/06/30* CopyRight (C) 2015-06*/
var PageHandler = (function($) {var isAddedFlag = false;return {searchClear:function(){$("#adPage-form").form("clear");},submitForm:function() {//获取当前页，总页数等信息var grid = $("#adPage-datagrid");var options = grid.datagrid('getPager').data("pagination").options;//表示当前页var curr = options.pageNumber;//表示总页数//var total = options.total;//表示每页的大小var pageRow = options.pageSize;//获得字段信息var adPageName = $("#adPage-form #adPageName").textbox("getValue");var adPageAddress = $("#adPage-form #adPageAddress").textbox("getValue");// 对table进行操作$("#adPage-datagrid").datagrid('load', {"page" : curr,"rows" : pageRow,"adPageName" : adPageName,"adPageAddress" : adPageAddress});},/*** 添加窗口中的重置按钮*/clearForm:function() {$("#adPage-add-form").form("clear");},/*** 打开添加UI*/addUI:function() {$("#adPage-add-window").window("open");},/*** 实现添加功能*/add:function() {var isValid = $("#adPage-add-form").form('validate');if(!isValid) {$.messager.alert('验证错误提示','对不起，信息格式错误!');} else {if(PageHandler.isAddedFlag) {$.messager.show({title : '消息提醒',msg : '正在保存，请您耐心等待...',timeout : 5000,showType : 'slide'});return;}if(!PageHandler.isAddedFlag) {//获得字段信息var adPageName = $("#adPage-add-window #adPageName").textbox("getValue");var adPageAddress = $("#adPage-add-window #adPageAddress").textbox("getValue");var adFunctionNum = $("#adPage-add-window #adFunctionNum").numberbox("getValue");PageHandler.isAddedFlag = true;jQuery.ajax({type : 'POST',url : basePath + "/adPage/createAdPage",data : {"adPageName" : adPageName,"adPageAddress" : adPageAddress,"adFunctionNum" : adFunctionNum},dataType : 'json',success : function(data) {if(data.result == "success") {$("#adPage-add-window").window("close");$("#adPage-datagrid").datagrid('reload');PageHandler.isAddedFlag = false;} else if (data.result == "error") {$("#adPage-add-window").window("close");$.messager.show({title : '消息提示',msg : data.msg,timeout : 5000,showType : 'slide'});PageHandler.isAddedFlag = false;}},error : function() {$.messager.show({title : '消息提示',msg : '添加失败......',timeout : 5000,showType : 'slide'});PageHandler.isAddedFlag = false;}});	}}},/*** 修改*/editUI:function() {var row = $("#adPage-datagrid").datagrid('getSelected');if (row) {var id = row.id;$("#adPage-edit-window #id").val(id);$("#adPage-edit-window #adPageName").textbox('setValue', row.adPageName);$("#adPage-edit-window #adPageAddress").textbox('setValue', row.adPageAddress);$("#adPage-edit-window #adFunctionNum").numberbox('setValue', row.adFunctionNum);$("#adPage-edit-window").window("open");} else {$.messager.show({title : '消息提示',msg : '对不起，没有选中要修改的行......',timeout : 5000,showType : 'slide'});}},edit:function() {//1、判断校验是否成功var isValid = $("#adPage-edit-window").form('validate');//2、如果失败则提示修改失败if(!isValid) {$.messager.alert('验证错误提示','对不起，信息格式错误!');} else {//3、如果成功则提交修改var id = $("#adPage-edit-window #id").val();var adPageName = $("#adPage-edit-window #adPageName").textbox('getValue');var adPageAddress = $("#adPage-edit-window #adPageAddress").textbox('getValue');var adFunctionNum = $("#adPage-edit-window #adFunctionNum").textbox('getValue');jQuery.ajax({type : 'POST',url : basePath + "/adPage/updateAdPage",data : {"id":id,"adPageName" : adPageName,"adPageAddress" : adPageAddress,"adFunctionNum" : adFunctionNum},dataType : 'json',success : function(data) {if(data.result == "success") {$("#adPage-edit-window").window("close");$("#adPage-datagrid").datagrid('reload');} else if (data.result == "error") {$("#adPage-edit-window").window("close");$.messager.show({title : '消息提示',msg : data.msg,timeout : 5000,showType : 'slide'});}},error : function() {$.messager.show({title : '消息提示',msg : '修改失败......',timeout : 5000,showType : 'slide'});}});	}},remove:function() {var row = $('#adPage-datagrid').datagrid('getSelected');if (row) {$.messager.confirm('Confirm','确定删除该用户吗?',function(r) {if (r) {jQuery.ajax({type : 'POST',url : basePath + "/adPage/updateFlag",data : {"id" : row.id,"flag":0},dataType : 'json',success : function(data) {if(data.result == "success") {$("#adPage-datagrid").datagrid('reload');} else if(data.result == "error") {$.messager.show({title : '消息提示',msg : data.msg,timeout : 5000,showType : 'slide'});}},error : function() {$.messager.show({title : '消息提示',msg : '删除失败......',timeout : 5000,showType : 'slide'});}});}});}}}
})(jQuery);var toolbar = [{text:'添加',iconCls:'icon-add',handler:PageHandler.addUI
},'-',{text : '修改',iconCls : 'icon-edit',handler : PageHandler.editUI
}, '-',{text : '删除',iconCls : 'icon-remove',handler : PageHandler.remove
}];



这篇关于使用js控制表单重复提交（1加锁，2事件方式，3 EasyUI中解决表单重复提交）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/918335。

相关文章

使用Python实现矢量路径的压缩、解压与可视化

使用Python实现矢量路径的压缩、解压与可视化

《使用Python实现矢量路径的压缩、解压与可视化》在图形设计和Web开发中,矢量路径数据的高效存储与传输至关重要,本文将通过一个Python示例,展示如何将复杂的矢量路径命令序列压缩为JSON格式,... 目录引言核心功能概述1. 路径命令解析2. 路径数据压缩3. 路径数据解压4. 可视化代码实现详解1
阅读更多...
Pandas透视表(Pivot Table)的具体使用

Pandas透视表(Pivot Table)的具体使用

《Pandas透视表(PivotTable)的具体使用》透视表用于在数据分析和处理过程中进行数据重塑和汇总,本文就来介绍一下Pandas透视表(PivotTable)的具体使用,感兴趣的可以了解一下... 目录前言什么是透视表？使用步骤1. 引入必要的库2. 读取数据3. 创建透视表4. 查看透视表总结前言
阅读更多...
Python 交互式可视化的利器Bokeh的使用

Python 交互式可视化的利器Bokeh的使用

《Python交互式可视化的利器Bokeh的使用》Bokeh是一个专注于Web端交互式数据可视化的Python库,本文主要介绍了Python交互式可视化的利器Bokeh的使用,具有一定的参考价值,感... 目录1. Bokeh 简介1.1 为什么选择 Bokeh1.2 安装与环境配置2. Bokeh 基础2
阅读更多...
Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

Android使用ImageView.ScaleType实现图片的缩放与裁剪功能

《Android使用ImageView.ScaleType实现图片的缩放与裁剪功能》ImageView是最常用的控件之一,它用于展示各种类型的图片,为了能够根据需求调整图片的显示效果,Android提... 目录什么是 ImageView.ScaleType？FIT_XYFIT_STARTFIT_CENTE
阅读更多...
Spring 中的循环引用问题解决方法

Spring 中的循环引用问题解决方法

《Spring中的循环引用问题解决方法》：本文主要介绍Spring中的循环引用问题解决方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录什么是循环引用？循环依赖三级缓存解决循环依赖二级缓存三级缓存本章来聊聊Spring 中的循环引用问题该如何解决。这里聊
阅读更多...
Java学习手册之Filter和Listener使用方法

Java学习手册之Filter和Listener使用方法

《Java学习手册之Filter和Listener使用方法》：本文主要介绍Java学习手册之Filter和Listener使用方法的相关资料,Filter是一种拦截器,可以在请求到达Servl... 目录一、Filter（过滤器）1. Filter 的工作原理2. Filter 的配置与使用二、Listen
阅读更多...
Pandas使用AdaBoost进行分类的实现

Pandas使用AdaBoost进行分类的实现

《Pandas使用AdaBoost进行分类的实现》Pandas和AdaBoost分类算法,可以高效地进行数据预处理和分类任务,本文主要介绍了Pandas使用AdaBoost进行分类的实现,具有一定的参... 目录什么是 AdaBoost？使用 AdaBoost 的步骤安装必要的库步骤一：数据准备步骤二：模型
阅读更多...
使用Pandas进行均值填充的实现

使用Pandas进行均值填充的实现

《使用Pandas进行均值填充的实现》缺失数据（NaN值）是一个常见的问题,我们可以通过多种方法来处理缺失数据,其中一种常用的方法是均值填充,本文主要介绍了使用Pandas进行均值填充的实现,感兴趣的... 目录什么是均值填充？为什么选择均值填充？均值填充的步骤实际代码示例总结在数据分析和处理过程中，缺失数
阅读更多...
Java对象转换的实现方式汇总

Java对象转换的实现方式汇总

《Java对象转换的实现方式汇总》：本文主要介绍Java对象转换的多种实现方式,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录Java对象转换的多种实现方式1. 手动映射（Manual Mapping）2. Builder模式3. 工具类辅助映
阅读更多...
如何使用 Python 读取 Excel 数据

如何使用 Python 读取 Excel 数据

《如何使用Python读取Excel数据》：本文主要介绍使用Python读取Excel数据的详细教程,通过pandas和openpyxl,你可以轻松读取Excel文件,并进行各种数据处理操... 目录使用 python 读取 Excel 数据的详细教程1. 安装必要的依赖2. 读取 Excel 文件3. 读
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2