window.location 更改完成后有什么方法可以触发回调吗？答案

【问题标题】：Is there any way to trigger a callback after a window.location change is finished?window.location 更改完成后有什么方法可以触发回调吗？
【发布时间】：2014-08-26 19:47:44
【问题描述】：

以下所有内容都会成功地将用户重定向到另一个页面（当然是their own caveats）：

window.location.replace(new_url),
window.location.assign(new_url),
window.location = new_url,

对someone asking if you can get a callback for changing location 的典型回应当然是不，因为将用户带到新页面意味着您页面上的脚本不再有效。

这一切都很好，但在您使用上述三种方法中的任何一种下载文件的情况下，用户不仅会停留在与他们所在的页面相同的页面上，而且还会有轻微的延迟（取决于网络速度）在更新 location 和文件实际开始下载之间。

在这种情况下（用户留在更新window.location 的页面上），是否有任何方法可以创建回调，例如，在重定向之前的行显示加载图标直到文件真的开始下载了吗？

【问题讨论】：

See this old question of mine. 特别是 T. J. Crowder 的回答效果很好。
您在这里真正要说的是，您正在重定向到具有正确标题和响应代码的文件，因此页面并没有真正重定向，它只是开始下载。如果是这样，您可以在重定向上方的行中显示加载图像，并在下面的行中将其删除，因为“滞后”是浏览器停止。
@adeneo 在文件开始下载之前重定向触发后立即放置代码。我假设“滞后”实际上是在服务器上等待响应请求的文件。
然后看看@Pointy 发布的内容，在文件启动时使用服务器设置的 cookie 以及检查此类 cookie 的时间间隔是此类问题的常见解决方案。

标签： javascript html google-chrome

【解决方案1】：

您可以创建一个隐藏的 iFrame，指向可下载的文件。用户不会注意到差异，同时您可以继续在主文档上运行脚本。

function downloadURL(url, callback){
   var hiddenIFrameID = 'hiddenDownloader' + count++;
   var iframe = document.createElement('iframe');
   iframe.id = hiddenIFrameID;
   iframe.style.display = 'none';
   document.body.appendChild(iframe);
   iframe.src = url;
   callback();
}
downloadURL("http:\\...", function() { alert('is downloading'); });

【讨论】：

这不符合预期，回调被立即调用，而不是之后。

【解决方案2】：

我在@Semyon Krotkih 答案的启发下编写了以下代码。它使用 jQuery。它也没有任何错误支持，但它可以工作:)

function downloadURL(url, callback) {

    var id = 'hiddenDownloader';
    $('body').append('<iframe id="' + id + '" style="display: block" src="' + url + '"></iframe>');

    var $iframe = $('#' + id);
    $iframe.on('load', function () {
        $iframe.remove();
        // no error support
        callback();
    });
}


downloadURL('http://example.com', function() {
  alert('Done');
});

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"&gt;&lt;/script&gt;

【讨论】：

这对我不起作用。没有js错误，什么都没有。下载正常，但警报从未显示。