php ajax jquery 表单重复提交,jQuery的 $.ajax防止重复提交的两种方法(推荐)
下面给大家带来两种关于jquery 的ajax防止重复提交的解决方法,具体介绍如下所示:
1、第一种,对于onclick事件触发的的ajax
可以采用如下方法:
即在beforeSend中使点击按钮不可用,ajax结果返回后置为可用
$.ajax(
{
type: 'POST',
url: APP+'?m=Shopping&a=ajaxSubmitorder&sid='+sid+'&src='+src,
cache:false,
dataType: 'json',
data: {'src':src,"uid": uid,'shipping_id':shipping_id,'order_amount':order_amount,'amount':amount,'postscript':postscript,'addr_id':addr_id},
async: false,
beforeSend:function()
{ //触发ajax请求开始时执行
$('#submit_font').text('提交订单中...');
$('.pay_alipay').attr('onclick','javascript:void();');//改变提交按钮上的文字并将按钮设置为不可点击
},
success: function (msg, textStatus)
{
if(msg.result==1)
{
$.Alert('成功提交订单', 160);
window.location.href=APP+'?m=Pay&a=index&sid='+ sid + '&fuid='+ fuid + '&parent_order_sn='+msg.parent_order_sn;
}
else
{
$.Alert(msg.msg, 160);
$('#submit_font').text('提交订单');
$('.pay_alipay').attr('onclick','submitorder();');//改变提交按钮上的文字并将按钮设置为可点击
}
},
error: function (textStatus)
{
$.Alert('网络繁忙,请稍后再试...', 160);
$('#submit_font').text('提交订单');
$('.pay_alipay').attr('onclick','submitorder();');//改变提交按钮上的文字并将按钮设置为可点击
},
complete: function(msg, textStatus)
{
//ajax请求完成时执行
if(msg.result==1)
{
$('#submit_font').text('提交订单');
$('.pay_alipay').attr('onclick','javascript:void();');//改变提交按钮上的文字并将按钮设置为可以点击
}
}
});
2、利用jquery ajaxPrefilter中断请求
1)Prefilters是一个预过滤器,在每个请求之前被发送和$.ajax()处理它们前处理。
options 是请求的选项
originalOptions 值作为提供给Ajax方法未经修改的选项,因此,没有ajaxSettings设置中的默认值
jqXHR 是请求的jqXHR对象
以上内容的核心思想是维护一个队列,发送请求时,将请求加入队列,请求响应后,从队列中清除,这就保证了在任一时刻只能有一个同样的请求发送.
局限性:仅仅是前台防止jQuery的ajax请求。对于非jquery的ajax请求,不起作用。因为使用的是jquery的ajaxPreFilter函数,仅仅对jquery的ajax请求有作用。
2)按钮每次点击都会向后端发送请求,下面的demo实现了多次点击按钮之后,只保证最后一次点击的请求能够成功。
button1
button2
button3
var pendingRequests = {};
jQuery.ajaxPrefilter(function( options, originalOptions, jqXHR ) {
var key = options.url;
console.log(key);
if (!pendingRequests[key]) {
pendingRequests[key] = jqXHR;
}else{
//jqXHR.abort(); //放弃后触发的提交
pendingRequests[key].abort(); // 放弃先触发的提交
}
var complete = options.complete;
options.complete = function(jqXHR, textStatus) {
pendingRequests[key] = null;
if (jQuery.isFunction(complete)) {
complete.apply(this, arguments);
}
};
});
$("#button1").live("click", function() {
$.ajax('config/ajax/appinfoListFetcher.json', {
type:'POST',
data: {param1:1,
param2:2,
},
success: function(res){
//后端数据回写到页面中
},
error:function(jqXHR, textStatus, errorThrown){
if(errorThrown != 'abort'){
alert('应用加载失败!');
}
}
});
});
调用abort后jquery会执行error的方法,抛出abort的异常信息。可以使用以下方式区分出该类型的异常。
3)注意事项:对于嵌套的点击事件的代码,是不起作用的。
$('.btn-cancel-all').live('click',function()
{
$('.confirm-dialog .confirm').live('click',function()
{
$.ajax({
//这里面的ajax事件是不能起作用的
})
}
}
以上所述是小编给大家介绍的jQuery的 $.ajax防止重复提交的两种方法(推荐),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!
php ajax jquery 表单重复提交,jQuery的 $.ajax防止重复提交的两种方法(推荐)相关推荐
- jQuery的 $.ajax防止重复提交的两种方法(推荐)
本文给大家分享两种jquery 的ajax防止重复提交的方法,第一种方法对于onclick事件触发的ajax,在beforeSend中使点击按钮不可用,ajax结果返回后置为可用,第二种利用jquer ...
- jQuery框架学习第十一天:实战jQuery表单验证及jQuery自动完成提示插件
jQuery框架学习第一天:开始认识jQuery jQuery框架学习第二天:jQuery中万能的选择器 jQuery框架学习第三天:如何管理jQuery包装集 jQuery框架学习第四天:使用jQ ...
- jQuery 表单验证插件 jQuery Validation Engine 使用
jQuery 表单验证插件 jQuery Validation Engine 使用方式如下: 1.引入头文件(注意一定要把jQuery放在前面),指定使用 jQuery Validation Engi ...
- jQuery 表单验证插件jQuery Validation Engine用法详解
功能强大的 jQuery 表单验证插件,适用于日常的 E-mail.电话号码.网址等验证及 Ajax 验证,除自身拥有丰富的验证规则外,还可以添加自定义的验证规则. jQuery Validation ...
- jq和ajax进行表单校验,对于新增行ID重复问题的处理
对于输入的数据进行校验:但是总是只能取到第一行的值,是因为对于新增的表格行使用的是clone函数,所以所有的表格行ID重复,如果从表格行以ID取值,则只能取到第一行的值,因此可以添加name属性,从n ...
- django种表单post出现CSRF verification failed( CSRF验证失败 ) 的两种解决方案
现象 表单界面如下: 在点击提交之后,出现如下错误页面: HTML的代码如下: contact_form.html <!DOCTYPE HTML PUBLIC ><html> ...
- 用C++实现单链表的创建、逆置和输出 的两种方法
http://blog.csdn.net/lfeng_coding/article/details/47300563 题目描述:在已知单链表头节点的情况下,设计算法逆置单链表并输出 方法一:采用首先将 ...
- js判断数组中重复元素并找出_JavaScript判断数组重复内容的两种方法(推荐)
前言 一般,我们可能会给数组去重,这个操作并不复杂,执行一个循环就是了.现在,我要做的是,判断数组中是否有重复的内容,如果有,返回 true 否则,返回 false. 思路 把数组变成字符串 循环原数 ...
- 进Linux系统单用户模式,Linux进入单用户模式的两种方法
单用户模式的作用 在使用Linux系统中,维护人员经常会碰到一个问题,就是在拥有root账号权限和密码的用户中,总是会出现忘记root密码的情况. 遇到这种情况,一般情况下,维护人员就会通过最常用的方 ...
最新文章
- java配置mq环境变量_RocketMQ学习-01安装及环境配置
- Keepalived+LVS+Nginx+DRBD+Heartbeat+Zabbix集群架构
- 施一公:大学必须不计成败、不论得失地为探索者提供宽容和支持的环境
- java 头尾 队列_源码|jdk源码之栈、队列及ArrayDeque分析
- git 错误 RPC
- Java多线程,实现卖电影票的业务
- Linux把文件移动到容器外,Docker容器与主机之间拷贝文件的方法
- java虚拟机之二虚拟机内存结构
- 【opencv】图像处理之相似变换、仿射变换、透视变换
- SpringCloud工作笔记055---SpringBoot中配置事物管理
- linux系统优化步骤,Linux系统优化的步骤有哪些
- springBoot集成Mybatis-Generator
- arm-linux-gcc stdio.h,arm-linux-gcc stdio.h no such file or directory错误
- mysql 中逆向表模型_PowerDesigner 逆向生成数据库物理模型,以 MySQL 为例
- hdoj 2586 How far away ?
- Windows下强制删除文件或文件夹
- Installation failed due to: ‘‘cmd package install-create -r -t --user current --full --dont-kill -t
- IDEA的配置文件乱码
- Python爬虫系列(一)环境搭建,以及简单使用,体验他的强大
- NoSQL与SQL:选择数据管理解决方案
热门文章
- bit、byte、位、字节、汉字、字符之间的区别
- ppt流程图字体太小_PPT演示让你尴尬的5大突发情况,早学早预防!
- android模拟全局按键,android命令行模拟输入事件(文字、按键、触摸等)
- java 钉钉获取用户信息,JAVA maven项目如何使用钉钉SDK来获取token、用户
- asp打开exe执行本地程序._基于QT应用程序打包成可执行程序exe
- python3spark文本分类_如何用Spark深度集成Tensorflow实现文本分类?
- PHP条件语句总结,PHP 条件语句基本语法结构
- linux同步硬件和系统时钟,liunx系统下时钟不同步会出现问题 怎么同步Linux 的系统时钟和硬件时钟?...
- python 效率_Python 运行效率为何低
- [Python3] 020 借函数,谈一谈变量的作用域