在加载新页面之前停止js循环

Question

我有一个JavaScript循环，它在进入时检查数据库表中的新消息。这可以避免AJAX请求，并且工作正常。每当我尝试导航到其他页面时，都会出现问题（仅在Chrome中）。页面挂起，就好像页面正在等待脚本在重定向/重新加载之前完成一样。我需要一种方法，可以在页面卸载或重新加载时停止脚本的运行。我尝试过使用jQuery的onbeforeunload函数并将其绑定到$(window)，但问题仍然很明显。我不确定在哪里/要尝试什么。谷歌搜索后，我能找到的所有方法都是停止页面重定向，除非在确认窗口中单击“是”。这不是我需要的。

只是为了澄清，我需要一个会做的方法如下：

1. 用户点击即可离开/重新加载页面
2. 的JavaScript确定这一点，并停止脚本死在它的轨道，无论进展。 （我不是说剧本即将完成还是刚刚开始）
3. 脚本一旦停止，然后重定向到所需的页面。

看来这样做过于简单，但我无法弄清楚。

任何帮助将大力赞赏！

代码：

// Document Ready that will initiate the loop. 
$(document).ready(function() { 
    // Notification System Start 
    var onLoadMsgs = document.getElementById("currentNotifs").value; 
    getRedMsgUpdates(onLoadMsgs, true); 
    // Notification System End 
}); 

// AJAX Function that will get the # of msgs 
function getRedMsgUpdates() { 
var pageDetect = document.URL.indexOf("job.php"); 
var self  = this; 
var results  = {}; 
var updateUrl = "/includes/record_count.php"; 

$.ajax({ 
    method: 'GET', 
    cache: false, 
    url: updateUrl, 
    datatype: 'text', 
    data: { 
    }, 
    success:function(redResponse){ 
     if(redResponse == 0) { 
      var redResponse = "  " + redResponse; 
     } else if (redResponse >= 1 && redResponse <= 9) { 
      var redResponse = "&nbsp;&nbsp;" + redResponse; 
     } else if (redResponse >= 10 && redResponse <= 99) { 
      var redResponse = redResponse; 
     } else if (redResponse >= 100) { 
      var redResponse = "99+"; 
     } else { 
      var redResponse = "ERR"; 
     } 

     document.getElementById('secoNotifsNum').innerHTML = redResponse; 
     if(redResponse == "&nbsp;&nbsp;" + 1 && pageDetect == "41") { 
      document.getElementById('redBarText').innerHTML = '<a target="_blank" href="/includes/Messages.php">' + redResponse + ' Emergency Message Outstanding</a>'; 
     } else if(redResponse == "&nbsp;&nbsp;" + 1) { 
      document.getElementById('redBarText').innerHTML = '<a href="/includes/Messages.php">' + redResponse + ' Emergency Message Outstanding</a>'; 
     } else if(redResponse != "&nbsp;&nbsp;" + 1 && pageDetect == "41") { 
      document.getElementById('redBarText').innerHTML = '<a target="_blank" href="/includes/Messages.php">' + redResponse + ' Emergency Messages Outstanding</a>'; 
     } else if(redResponse != "&nbsp;&nbsp;" + 1) { 
      document.getElementById('redBarText').innerHTML = '<a target="_blank" href="/includes/Messages.php">' + redResponse + ' Emergency Messages Outstanding</a>'; 
     } 

     flashRedBackground(redResponse); 
    } 
}); 
timeout1 = setTimeout(function() {getRedMsgUpdates();}, 2000); 
} 

// Function that will make the notification Bar/Circle flash 
function flashRedBackground(msgs) { 
    var audio = new Audio('/js/audio/siren1.wav'); 
    if(msgs != "&nbsp;&nbsp;" + 0) { 
     // Flash Background 
     $("#notificationRedFull").show(); 
     $("#notificationRedFull").css("opacity", "1"); 
     $("#notificationRedFull").fadeOut(1000).fadeIn(1000).fadeOut(1000).fadeIn(1000).fadeOut(1000).fadeIn(1000); 
     $("#notificationBarRed").css("opacity", "1"); 
     $("#notificationBarRed").fadeOut(1000).fadeIn(1000).fadeOut(1000).fadeIn(1000).fadeOut(1000).fadeIn(1000); 
     audio.play(); 
    } else if(msgs == "&nbsp;&nbsp;" + 0) { 
     // Ensure Notification Not Shown 
     $("#notificationRedFull").hide(); 
     $("#notificationRedFull").css("opacity", "0"); 
     $("#notificationBarRed").css("display", "none"); 
    } 
} 

Answer 1

$(window).on('beforeunload', function(){ clearTimeout(timeout1); }); 

而且我会移动你setTimeout到ajax.complete处理程序。

Answer 2

你可以尝试，并指定Ajax请求给一个变量，并使用中止请求以下

request.abort(); 

这可能摆脱延迟。

希望这会有所帮助。