$.ajax防止多次点击重复提交的方法
第一种:使用$.ajaxPrefilter( [dataTypes], handler(options, originalOptions, jqXHR) ) 方法:
$.ajaxPrefilter()方法 :是对全局所有的ajax请求有效,在所有的ajax请求之前,会对每一个请求统一做一些处理,可以去设置ajax的选项,也可以对现有的ajax选项进行更改;
接收两个参数:
dataTypes :可选参数,一个可选的字符串,其中包含一个或多个空格分隔的数据类型;
handler(options, originalOptions, jqXHR):一个函数,接收三个参数。
各个参数的含义:
options : 是请求的选项,包括accepts、crossDomain、contentType、url、async、type、headers、error、dataType等许多参数选项
originalOptions : 值作为提供给Ajax方法未经修改的选项,因此,没有ajaxSettings设置中的默认值
jqXHR :就是经过jQuery封装的XMLHttpRequest对象(保留了其本身的属性和方法)
代码如下:
$.ajaxPrefilter(function( options, originalOptions, jqXHR ) {
if ( options.abortOnRetry ) {
if ( currentRequests[ options.url ] ) {
currentRequests[ options.url ].abort();
}
currentRequests[ options.url ] = jqXHR;
}
});
第二种:使用beforeSend选项,在发送请求前将提交按钮变为不可用的状态;
上面的第一种方法是针对所有的ajax请求,而这一种针对的是单个的请求;
在点击过一次提交后,在提交完成前都将提交按钮不可用,这样就避免掉了重复点击的问题
$.ajax({
url:'testurl',
beforeSend:function(){
$('.submit').attr('onclick','javascript:void();');
},
success:function(data){
$('.submit').removeAttr('onclick')
},
error:function(){
$('.submit').removeAttr('onclick')
}
})
随机推荐
- [51nod1264]线段相交
给定两个点: typedef struct { double x, y; } Point; Point A1,A2,B1,B2; 首先引入两个实验: a.快速排斥实验 设以线段A1A2和线段B1B ...
- jeecms v8 网站访问量配置
<script src="${resSys}/jquery.js" type="text/javascript"></script> & ...
- 使用 jquery.webcam 进行asp.net 拍照
HTML 代码 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="index. ...
- Educational Codeforces Round 52D(ARRAY,模拟最短路)
#include<bits/stdc++.h>using namespace std;int n,x;int chess[17*17];//记录棋盘上的numberarray<int ...
- PAT L2-014【二分】
思路: 最后发现对当前列车比我大的编号的栈有没有就好了,所以开个vector存一下,然后二分一下vector找一下第一个比我大的数就好了 #include <bits/stdc++.h> ...
- [Unity3D] 5.0 图集合并扩展工具,用于解决UGUI与AssetBundle打包造成资源包过大的问题
[Unity3D] 5.0 图集合并扩展工具,用于解决UGUI与AssetBundle打包造成资源包过大的问题 2017年07月05日 15:57:44 阅读数:1494 http://www.cpp ...
- 再回首HTML
前言 本阶段视频自己前后看了两遍,感觉效果还是不错的,鉴于昨天上午整理了一些笔记,对HTML的理解深刻了一些.所以在这篇博文中就不再解释关于HTML一些定义的东西,这篇博文主要记录一些常用标记,为以后 ...
- Repeater+AspNetPager+Ajax留言板
最近想要巩固下基础知识,于是写了一个比较简单易懂实用的留言板. 部分样式参考了CSDN(貌似最近一直很火),部分源码参照了Alexis. 主要结构: 1.前期准备 2.Repeater+AspNetP ...
- Mac 安装flutter 踩坑记
完整版请看链接: http://b36d5043.wiz03.com/share/s/2Prl132RpQ3x2XpA4I2oTa2204K0FF0vB4J42tWIEQ04UrAg 首先下载flut ...
- @Transactional之Spring事务深入理解
Spring支持两种事务方式: 编程式事务:使用的是TransactionTemplate(或者org.springframework.transaction.PlatformTransac ...