JQuery脚本-通过禁用按钮防止表单重复提交
<script type="text/javascript">
/*
jquer 脚本,避免重复提交
隐藏点击的submit,后在他之后插入同名button伪装成被隐藏的submit
最后禁用全部可见的submit和button
最终效果:点击按钮提交表单后,点击后退按钮,返回提交表单页面,提交按钮已被禁用
注:此方法毕竟在客户端处理,防君子不防小人
*/
$(document).ready(function() {
$(":submit").click(function() {
$(this).hide();
$(this).after("<input type=\"button\" value=\"" + $(this).val() + "\">");
$(":submit:visible").attr("disabled", "disabled");
$(":button:visible").attr("disabled", "disabled");
alert($(this).val());
});
});
</script>
******************************************************************************************************
这里提供两种不同情况下的阻止重复点击解决方案。
1.按钮BUTTON类
2.<a>标签类
对于第一类情况,button有一个属性是disabled控制其是否可以点击,看代码:
<input type="button" value="Click"id="subBtn"/>
<script type="text/javascript">
function myFunc(){
//code
//执行某段代码后可选择移除disabled属性,让button可以再次被点击
$("#subBtn").removeAttr("disabled");
}
$("#subBtn").click(function(){
//让button无法再次点击
$(this).attr("disabled","disabled");
//执行其它代码,比如提交事件等
myFunc();
});
</script>
第二类情况,可以使用按钮或链接的click事件来执行预期的单击动作,然后将事件处理重定向,以阻止其余的点击。
<a href="javascript:;" onclick="return funcOne();">点击</a>
<scripttype="text/javascript">
function funcOne(){
//点击一次后把funcTwo赋给funcOne,funcTwo是一个什么也不执行的函数,因此再次点击不执行任何操作
funcOne=funcTwo;
alert("Clickthe button!");
return false;
}
function funcTwo(){
return false;
}
</script>
JQuery脚本-通过禁用按钮防止表单重复提交的更多相关文章
- 防止Web表单重复提交的方法总结
在Web开发中,对于处理表单重复提交是经常要面对的事情.那么,存在哪些场景会导致表单重复提交呢?表单重复提交会带来什么问题?有哪些方法可以避免表单重复提交? 表单重复提交的场景 1.场景一:服务端未能 ...
- java web学习总结(十三) -------------------使用Session防止表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- JavaWeb防止表单重复提交(转载)
转载自:http://blog.csdn.net/ye1992/article/details/42873219 在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用 ...
- JavaWeb---总结(十三)使用Session防止表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- [Java拾遗五]使用Session防止表单重复提交
申明:此文章属于转载, 转自博客: http://www.cnblogs.com/xdp-gacl/p/3859416.html在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没 ...
- java web 学习十三(使用session防止表单重复提交)
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- JavaWeb学习总结(十三)——使用Session防止表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- (转)JavaWeb学习总结(十三)——使用Session防止表单重复提交
如何防止表单重复提交 在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复 ...
- 使用Session防止表单重复提交
本文出处:http://www.cnblogs.com/xdp-gacl/p/3859416.html 在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以 ...
随机推荐
- DataType--时间类型
SQL SERVER 存储时间的方式和存放浮点数的方式类似,存放时按照一定公式算出一个数值,存放到页面,在读取时按照公式求算出时间值,再按照默认或指定的时间格式展示给用户. 如果存放DATETIME数 ...
- Persistent and Transient Data Structures in Clojure
此文已由作者张佃鹏授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 最近在项目中用到了Transient数据结构,使用该数据结构对程序执行效率会有一定的提高.刚刚接触Trans ...
- App Store Connect Operation Error ERROR ITMS-90032: "Invalid Image Path - No image found at the path referenced under key 'CFBundleIcons': 'AppIcon20x20'"
1.报错现象 应用提交新包出现报错,切换渠道没问题,但替换回原来的图片资源就出问题了. 明显原因出在图片资源上 2.解决办法 找到原始1024的图片,将图片打开,使用截图工具截图,不要使用另存为的方式 ...
- Mybatis中的连接池
Mybatis中DataSource的存取 MyBatis是通过工厂模式来创建数据源DataSource对象的,MyBatis定义了抽象的工厂接口:org.apache.ibatis.datasour ...
- python爬取淘宝排名
import timeimport jsonimport requestsimport xlrdimport randomimport os from xlutils.copy import copy ...
- fiddler 代理调试本地手机页面
https://www.cnblogs.com/zichi/p/4944581.html
- luoguP4396 [AHOI2013]作业
https://www.luogu.org/problemnew/show/P4396 简单的莫队+树状数组,但博主被卡常了,不保证代码在任何时候都能AC #include <bits/stdc ...
- The server of Apache (四)——配置防盗链和隐藏版本信息
一.防盗链 防盗链就是防止别人的网站代码里面盗用我们服务器的图片.文件.视频等相关资源,比如我们的网页的图片有链接,别人把链接复制粘贴到他们的服务器页面里,图片不在他们自己的网站里,每次打开他们的网站 ...
- 【离散数学】SDUT OJ 指定长度路径数
指定长度路径数 Time Limit: 1000 ms Memory Limit: 65536 KiB Submit Statistic Problem Description 题目给出一个有n个节点 ...
- socket长连接 GCDAsyncSocket
基础: http://www.2cto.com/kf/201609/546974.html 转自: http://blog.csdn.net/u013282507/article/details/52 ...