防止重复发送ajax请求

前端代码是当输入密码个数为6个的时候,触发ajax请求,但输入很快的时候会触发多个请求,为了防止重复发送请求。

可以利用jquery ajaxPrefilterzhong中断请求

局限性:仅仅对jquery 发送的ajax请求有作用

调用abort后jquery会执行error的方法,抛出abort的异常信息。可以使用以下方式区分出该类型的异常。

error:function(jqXHR, textStatus, errorThrown){    if(errorThrown != ‘abort‘){        //ajax被调用abort后执行的方法        alert(‘应用加载失败!‘);    }}

Demo:

var pendingRequests = {};jQuery.ajaxPrefilter(function( options, originalOptions, jqXHR ) {    var key = options.url;    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);        }    };});
$.ajax({    type:"post",    url:url,    data:{"act":"checkpwd","password":pwd},    dataType:"json",    success:function(request){        if(request.statu == 0){            Air_View("支付密码错误");        }else{            $("#walletpay").submit();        }

    },    error:function(jqXHR, textStatus, errorThrown){        if(errorThrown != ‘abort‘){            //ajax被调用abort后执行的方法            Air_View(‘应用加载失败!‘);        }    }});


时间: 2024-10-05 17:21:58

防止重复发送ajax请求的相关文章

防止重复发送Ajax请求的解决方案

防止重复发送Ajax请求的解决方案 这篇文章主要介绍了防止重复发送Ajax请求的解决方案,感兴趣的小伙伴们可以参考一下 在页面中有多个按钮,点击该按钮可以异步的去服务端读取数据,然后在前端将数据展示出来. 每个按钮点击请求的页面都是同一个,但是请求的参数不同,所以返回的内容就不同. 在连续点击多个按钮的时候就会发出多个异步请求.那么根据请求返回的快慢(因为不同按钮参数不同,返回内容不同,所以会有快慢之分),数据会依次的展示出来,那么就会出现一个先点击的按钮,由于他请求的数据量比较大,导致数据被后

怎样防止重复发送 Ajax 请求?

一个简易的需求,点一个按钮,则向服务器请求资源,不作处理时,多次点击后会有很多个请求在等待.粗暴的解决方式是点一次就将按钮disable掉.请问一下有没有更好的办法,比如多点一次后自动down掉前一次请求?补充:不是一次请求,更类似于gmail的全站AJAX,刚用firebug看了一下gmail,发现重复请求时,之前的请求状态变为“Aborted”,并且不反回任何数据.请问是如何做到的呢?毕竟一般理解客户端AJAX发送后是不能终止的. A. 独占型提交只允许同时存在一次提交操作,并且直到本次提交

原生js和jquery发送ajax请求及封装

原生js                                   // ajax get 五部曲function ajax_get(url,data){ // 异步对象 var ajax=new XMLHttpRequest(); // 设置url和请求方式 // url方法 如果有数据要把数据拼接到url中?name=jack&age=20 if(data){ url+=?; url+=data; }else{}; ajax.open('get',url); // 发送请求 aja

通过在jquery中添加函数发送ajax请求来加载数据库数据,以json的格式发送到页面

通过在jquery中添加函数发送ajax请求来加载数据库数据,以json的格式发送到页面 从数据库中查询仓库信息,显示在下拉菜单中: 首先,引入js插件,这里使用jquery-1.8.3.js <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.js"></script> 当页面加载完成后,就应该发送ajax请求到数据库,

使用原生JavaScript发送ajax请求

关于使用原生JavaScript发送异步请求给服务端. 准备工作: 代码编写工具用的是sublime 服务端使用的是wamp搭的一个本地Apache服务器,主要用来返回数据 方便测试 步骤: 浏览器端 html标签绑定事件发送ajax请求----> 五步操作:1 创建异步对象XMLHttpRequest; 2 设置method url 3 发送请求给服务端 4 注册事件   5 在事件中获取服务端返回的数据,进行操作. 服务器端 1 获取请求数据 2 返回结果给浏览器 下面来一个小demo1做一

JQuery发送ajax请求不能用数组作为参数

JQuery发送ajax请求不能用数组作为参数,否则会接收不到参数, 一.js代码如下: $('#delete-button').click(function(){        var selectedMembers = document.getElementsByName('selectedMembers');        var cwIds = new Array(); //定义数组        for(var i=0;i<selectedMembers.length;i++){  

jQuery发送ajax请求三种方式

<button>点击发送ajax get请求</button> <button>点击发送ajax post请求</button> <button>点击发送通用的ajax请求</button> <script type="text/javascript" src="jquery-1.8.3.min.js"></script> <script type="te

解决浏览器跨域限制发送ajax请求

一.什么是浏览器跨域限制?本质是什么? 所谓浏览器跨域限制,其实是为了数据安全的考虑由Netscape提出来限制浏览器跨域访问数据的策略,这是一中约定,正式叫法为浏览器同源策略,目前已经在大多数浏览器中支持. 本质上,所谓浏览器同源策略即:不允许浏览器访问跨域的Cookie,ajax请求跨域接口等.也就是说,凡是访问与自己不在相同域的数据或接口时,浏览器都是不允许的. 最常见的例子:对于前后端完全分离的Web项目,前端页面通过rest接口访问数据时,会出现如下问题: 不允许发送POST请求:在发

原生JS发送Ajax请求

注意了,划重点了,这一题考不到算我输! 一.JS原生Ajax Ajax=异步Javascript+XML: ajax是一种数据请求的方式,不需要刷新整个页面.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. ajax的核心技术当然是XMLHttpRequest对象: ajax请求过程:创建XMLHttpRequest对象.连接服务器.发送请求.接受相应数据. 废话少说上代码! p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0p