防止ajax重复请求的方法(GET和POST)

代码如下:

/*
防止ajax重复请求的GET和POST方法
*/
jQuery.extend({
getx:function(url,data,callback,sender){
var params={url:url,data:null,callback:null,sender:null};
for(var i=1;i<arguments.length;i++){
if(arguments[i]!=null){
var ptype=typeof(arguments[i]);
if(ptype=="function"){
params.callback=arguments[i];
}
else if(ptype=="string"){
params.sender=$(arguments[i]);
if(params.sender.data("isRequesting"))
return null;
}
else if(ptype=="object"){
if(arguments[i].tagName || arguments[i].selector){
params.sender=$(arguments[i]);
if(params.sender.data("isRequesting"))
return null;
}
else{
params.data=arguments[i];
}
}
}
}
params.sender.data("isRequesting",true);
return $.get(params.url,params.data,function(data,status){
params.sender.data("isRequesting",false);
if(data=="unlogin"){
window.top.location.href="/login.aspx";
return;
}
if(params.callback){
params.callback (data,status);
}
});
},
postx:function(){
var params={url:url,data:null,callback:null,sender:null};
for(var i=1;i<arguments.length;i++){
if(arguments[i]!=null){
var ptype=typeof(arguments[i]);
if(ptype=="function"){
params.callback=arguments[i];
}
else if(ptype=="string"){
params.sender=$(arguments[i]);
if(params.sender.data("isRequesting"))
return null;
}
else if(ptype=="object"){
if(arguments[i].tagName || arguments[i].selector){
params.sender=$(arguments[i]);
if(params.sender.data("isRequesting"))
return null;
}
else{
params.data=arguments[i];
}
}
}
}
params.sender.data("isRequesting",true);
return $.post(params.url,params.data,function(data,status){
params.sender.data("isRequesting",false);
if(data=="unlogin"){
window.top.location.href="/login.aspx";
return;
}
if(params.callback){
params.callback (data,status);
}
});
}
})

当然，这里可以抽出共同的一部分，也可以去封装$.ajax方法，但这里只是笔记...

赞 (0)

相关推荐

  • AJAX避免用户重复提交请求实现方案

    在使用AJAX(jQuery)异步请求数据时,为了避免因某些原因用户同时多次点击按钮,提交重复的请求,我们需要禁用请求提交按钮. 重点:jQuery的 attr 和 removeAttr 两个函数,主要是元素button的disabled属性. Demo: 复制代码 代码如下: <body> <a class="disabled">Button disabeld</a>    <a class="abled">Butt

  • jQuery validate插件实现ajax验证重复的2种方法

    本文实例讲述了jQuery validate插件实现ajax验证重复的2种方法.分享给大家供大家参考,具体如下: jquery validate 经过这种多年的改良,已经很完善了.它能满足80%的验证需要,如果validate自带的功能,不能满足我们需求,它提供了addMethod来扩展功能.下面就举个小例子来说明一下addMethod的用法. 完整demo实例代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//

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

    在页面中有多个按钮,点击该按钮可以异步的去服务端读取数据,然后在前端将数据展示出来. 每个按钮点击请求的页面都是同一个,但是请求的参数不同,所以返回的内容就不同. 在连续点击多个按钮的时候就会发出多个异步请求.那么根据请求返回的快慢(因为不同按钮参数不同,返回内容不同,所以会有快慢之分),数据会依次的展示出来,那么就会出现一个先点击的按钮,由于他请求的数据量比较大,导致数据被后显示出来. 一.问题解决 解决这种问题有两种方式: 1.当连续进行多个请求,并且请求的url地址相同时.放弃前面的所有请

  • 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: {'

  • JS Ajax请求如何防止重复提交

    好长时间没写js代码了刚好遇到这样的问题.我们系统多数表单没有做防止重复提交的. 由于不想在后端这边处理,因为假如由后端处理的话,就需要在页面加载的时候给出一次性的token值,加大了开发的工作量不说,还容易忘记做这个,同时,ajax也不好处理,需要提交失败的话同时返回新的token值. 所以我想在,js这边动手.其实以前和前端提过,久久不见动静,就只好弄块砖丢出去了.思路是,覆盖掉$.ajax,在这里面处理掉防止重复提交的问题,而前端的业务开发不受影响,不改代码,无感知. 我想架构的目的之一,

  • Ajax局部更新导致JS事件重复触发问题的解决方法

    如果在页面中包含一个ajax更新的列表,那么需要小心非动态更新部分的事件处理. 以带有公共工具栏的列表界面为例: | Menu1 | Menu2 ---------------------------------------------------------------------------- ID TITLE DESCRIPTION OPERATION 1 test1 hey test X - ... 2 test2 why not X - ... --------------------

  • Ajax校验是否重复的实现代码

    直接贴代码! 一.controller层: @ResponseBody @RequestMapping("entityFindByCode") public String entityFindByCode(Entity bean, HttpSession httpSession, Model m,HttpServletResponse res) throws IOException{ res.setContentType("text/plain; charset=UTF-8&

  • 防止ajax重复请求的方法(GET和POST)

    复制代码 代码如下: /* 防止ajax重复请求的GET和POST方法 */ jQuery.extend({ getx:function(url,data,callback,sender){ var params={url:url,data:null,callback:null,sender:null}; for(var i=1;i<arguments.length;i++){ if(arguments[i]!=null){ var ptype=typeof(arguments[i]); if(

  • 使用对象封装ajax重复调用的方法

    在项目中经常用到AJAX调用远程数据,每一次调用,都得写一个ajax方法,这就造成了重复代码过多,可读性也不够强,所以,我一般都是封装起来,需要的时候调用. var imgUpload = { //ajax请求数据 method:function(murl,mdata,method,success){ $.ajax({ type: method, url: murl, dataType : "jsonp", data: mdata, timeout: 20000, error: fun

  • 浅谈axios中取消请求及阻止重复请求的方法

    目录 前言 核心--CancelToken 实际应用和封装 一些小细节 前言 在实际项目中,我们可能需要对请求进行"防抖"处理.这里主要是为了阻止用户在某些情况下短时间内重复点击某个按钮,导致前端向后端重复发送多次请求.这里我列举两种比较常见的实际情况: PC端 - 用户双击搜索按钮,可能会触发两次搜索请求 移动端 - 因移动端没有点击延迟,所以极易造成误操作或多操作,造成请求重发 以上情况有可能在有Loading遮罩时依然发生,所以我们要考虑前端阻止重复请求的方法. 核心--Canc

  • Vue中Axios中取消请求及阻止重复请求的方法

    Vue中Axios中取消请求及阻止重复请求的方法

    目录 阻止请求目的: 常见情况: 新建 axios.js 文件 全局 main.js 引入 阻止请求目的: 为了防止用户在网络不好或者其他情况下短时间内重复进行接口请求,从而导致前端向后端重复发送多次请求. 常见情况: PC端:输入框搜素,多次请求接口移动端:移动端很容易造成误操作或多操作请求(移动端没有点击延迟)注意:有Loading遮罩时也有可能发生重复请求 新建 axios.js 文件 import axios from "axios"; // import router fro

  • Axios取消重复请求的方法实例详解

    Axios取消重复请求的方法实例详解

    目录 前言 一.如何取消请求 二.如何判断重复请求 三.如何取消重复请求 3.1 定义辅助函数 3.2 设置请求拦截器 3.3 设置响应拦截器 四.CancelToken 的工作原理 五.总结 六.参考资源 前言 在 Web 项目开发过程中,我们经常会遇到重复请求的场景,如果系统不对重复的请求进行处理,则可能会导致系统出现各种问题.比如重复的 post 请求可能会导致服务端产生两笔记录.那么重复请求是如何产生的呢?这里我们举 2 个常见的场景: 假设页面中有一个按钮,用户点击按钮后会发起一个 A

  • jQuery如何防止Ajax重复提交

    首先说说防止重复点击提交是什么意思. 我们在访问有的网站,输入表单完成以后,单击提交按钮进行提交以后,提交按钮就会变为灰色,用户不能再单击第二次,直到重新加载页面或者跳转.这样,可以一定程度上防止用户重复提交导致应用程序上逻辑错误. 不妨引深来看,它不一定发生在表单的提交事件上,同样可以发生在ajax的异步请求上.有效地在web客户端采用一定机制去防止重复点击提交,将大大减轻服务器端压力. 下面看下代码关于jquery ajax防止重复提交. ** * jquery ajax请求过滤,防止aja

  • 前端取消请求及取消重复请求方式

    前端取消请求及取消重复请求方式

    目录 一.前言 二.项目准备 三.原生方法 四.promise 五.借助Promise.race 六.总结 一.前言 今天,我想跟大家分享几种前端取消请求的几种方式. 相信大家在平时的开发中,肯定或多或少的会遇到需要取消重复请求的场景,比如最常见的,我们在使用tab栏时,我们都会使用一个盒子去存放内容,然后在切换tab栏时,会清除掉原来的内容,然后替换上新的内容,这个时候,如果我们的数据是通过服务从后端获取的,就会存在一个问题,由于获取数据是需要一定的时间的,就会存在当我们切换tab栏到新的ta

  • 基于CORS实现WebApi Ajax 跨域请求解决方法

    概述 ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是在使用API的时候总会遇到跨域请求的问题,特别各种APP万花齐放的今天,API的跨域请求是不能避免的. 在默认情况下,为了防止CSRF跨站的伪造攻击(或者是 javascript的同源策略(Same-Origin Policy)),一个网页从另外一个域获取数据时就会收到限制.有一些方法可以突破这个限制,那就是大家熟知的JSONP, 当然这只是众多

  • AngularJS实现ajax请求的方法

    本文实例讲述了AngularJS实现ajax请求的方法.分享给大家供大家参考,具体如下: [HTML 代码] <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1"> &

  • django通过ajax发起请求返回JSON格式数据的方法

    本文实例讲述了django通过ajax发起请求返回JSON格式数据的方法.分享给大家供大家参考.具体实现方法如下: 这是后台处理的: def checkemail(request): user = None if request.POST.has_key('email'): useremail = request.POST['email'] result = {} user = User.objects.filter(useremail__iexact = useremail) if user:

随机推荐