Как отменить запрос 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 request

Как я могу это сделать?

** Я специально хочу сделать это, когда когда-либо отправляете форму и после отправки формы, я хочу прервать эту функциютакже onbeforeunload **

Answer 1

Вы можете напрямую использовать xhr.abort () в методе обработки события «onbeforeunload»:

// 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";
};

Answer 2

вызов метода ниже, чтобы прервать вызов ajax

xhr.abort()