javascript - 如何在页面刷新时中止 ajax 请求

Question

我有一个表单，在提交时我正在发出一个 ajax 请求，有时需要时间来获取请求，所以我想要做的是每当form submitting我想中止该 ajax后用户刷新或点击浏览器的后退按钮称呼

• 我正在做的是

  $("#formId").submit(function(event) {
     event.preventDefault();
     var xhr = $.ajax({
        url : "Drilldown",
        method : "GET",
        success : function(data) {
           //  here doing ,my stuff    
        },
        complete : function() {
           $('.loader').hide();
           $('.overlay').hide();
        }
    });    
    window.onbeforeunload = function() {
       return "some message"; // here when user clicks on leave then want to abort like `xhr.abort`
    };    
  });
  

• 每当用户单击请假时，我想中止我的 ajax 请求

我怎样才能做到这一点？

**我特别想在提交表单和提交表单时这样做，我也想中止该功能onbeforeunload**

标签： javascriptjqueryajax

Answer 1

您可以直接在“onbeforeunload”事件处理方法中使用 xhr.abort()：

// Define xhr variable outside so all functions can have access to it
var xhr = null;

$("#formId").submit(function(event) {
    event.preventDefault();
    xhr = $.ajax({
        url: "Drilldown",
        method: "GET",
        success: function(data) {
            //  here doing ,my stuff

        },
        complete: function() {
            $('.loader').hide();
            $('.overlay').hide();
        }
    });
});

window.onbeforeunload = onUnload;

function onUnload() {
    if(xhr) xhr.abort();
    return "some message";
};