zoukankan      html  css  js  c++  java
  • 【javascript】利用jquery ajaxPrefilter防止ajax重复提交

    利用jquery ajaxPrefilter中断请求

        var pendingRequests = {};
        $.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 ($.isFunction(complete)) {
                complete.apply(this, arguments);
                }
            };
        });
    

    Prefilters是一个预过滤器,在每个请求之前被发送和 $.ajax() 处理它们前处理。

    options 是请求的选项

    originalOptions 值作为提供给Ajax方法未经修改的选项,因此,没有ajaxSettings设置中的默认值

    jqXHR 是请求的jqXHR对象

    以上内容的核心思想是维护一个队列,发送请求时,将请求加入队列,请求响应后,从队列中清除,这就保证了在任一时刻只能有一个同样的请求发送.

    局限性:仅仅是前台防止jquery的ajax请求。对于非jquery的ajax请求,不起作用。因为使用的是jquery的ajaxPreFilter函数,仅仅对jquery的ajax请求有作用。

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

    var ajax = $.ajax({
        'error':function(jqXHR, textStatus, errorThrown){
            if(errorThrown != 'abort'){
                //ajax被调用abort后执行的方法
                alert('您的ajax方法被停止了');
            }
        }
    })
  • 相关阅读:
    Analysis of Hello2 source code
    CORS’s source, Principle and Implementation
    CDI Features(EL(SPEL),Decorator,Interceptor,Producer)
    Java Design Patterns(2)
    Cookie and Session
    Vue错误信息解决
    cdh搭建仓库
    cdh本地源安装-自用
    创建本地repo源
    dockerfile:python-cuda-nvidia-cudnn
  • 原文地址:https://www.cnblogs.com/airven/p/5417656.html
Copyright © 2011-2022 走看看