终止当前页面所有还在请求中的AJAX请求

深藏阁楼爱情的钟 2022-07-21 11:10 134阅读 0赞

$.xhrPool = [];
    $.xhrPool.abortAll = function() { 
        $(this).each(function(idx, jqXHR) { 
            jqXHR.abort();
        });
        $.xhrPool = [];
    };
    
    $.ajaxSetup({
        beforeSend: function(jqXHR) { 
            $.xhrPool.push(jqXHR);
        },
        complete: function(jqXHR) { 
            var index = $.xhrPool.indexOf(jqXHR);
            if (index > -1) {
                $.xhrPool.splice(index, 1);
            }
        }
    });
    
    // Everything below this is only for the jsFiddle demo
    $('#cancelBtn').click(function() { 
        $.xhrPool.abortAll();
    });
    $('#doneLbl').hide();
    
    $.mockjax({
        url: "/OneSecond",
        responseTime: 1000
    });
    $.mockjax({
        url: "/ThreeSecond",
        responseTime: 3000
    });
    $.mockjax({
        url: "/FiveSecond",
        responseTime: 5000
    });
    $.mockjax({
        url: "/SevenSecond",
        responseTime: 7000
    });
    
    $.ajax({
        url: '/OneSecond',
        success: function() { 
            $('#completedList').append('<li>1 second finished</li>');
        },
        error: function () { 
            $('#canceledList').append('<li>1 second canceled</li>');
        }
    });
    $.ajax({
        url: '/ThreeSecond',
        success: function() { 
            $('#completedList').append('<li>3 second finished</li>');
        },
        error: function () { 
            $('#canceledList').append('<li>3 second canceled</li>');
        }
    });
    $.ajax({
        url: '/FiveSecond',
        success: function() { 
            $('#completedList').append('<li>5 second finished</li>');
        },
        error: function () { 
            $('#canceledList').append('<li>5 second canceled</li>');
        }
    });
    $.ajax({
        url: '/SevenSecond',
        success: function() { 
            $('#completedList').append('<li>7 second finished</li>');
            $('#doneLbl').show();
        },
        error: function () { 
            $('#canceledList').append('<li>7 second canceled</li>');
            $('#doneLbl').show();
        }
    });