如何在ajax调用完成之前阻止页面导航

Question

所以我有一个ajax调用来调低几十个大小的数据块,然后通过html5文件系统api在本地存储数据.

我想阻止用户在完成ajax调用之前导航离开页面.我决定探索这个onbeforeunload事件,让它通知用户应该留在页面上,直到ajax调用完成.我在AJAX调用之前设置了以下内容,在AJAX调用结束/成功时我重置了window.onbeforeunload.

window.onbeforeunload = function(){
    return "Information is still downloading, navigating away from or closing "+ 
        "this page will stop the download of data";
}

当我尝试关闭页面或离开页面时,弹出消息会按预期显示,通知用户留下.但是,一旦我确认我想留在页面上,ajax调用就不会从他们中断的地方恢复.有没有办法阻止ajax调用暂停/停止或继续执行/重启执行？

我愿意接受任何想法来实现本文标题中描述的所需功能.

Answer 1

很确定你可以在.js文件中创建一个全局像...

var request;

然后将ajax调用分配给此变量.

request = $.ajax{
 //Ajax
 //Stuff
 //Goes
 //Here
}

现在在window.unbeforeunload函数内部添加此条件语句.

window.onbeforeunload = function(){
  if(!request){
    return "Request not initiated";
  }else{
    //Request is in progress...
    //You can use request.abort() if you need
  }
}

编辑:要详细说明您可以在request对象上使用的一些方法,请查看此页面.(例如,.done或.always可能适合您的情况)