如何在使用Javascript下载后重定向到新页面

Question

我有一个表格可以下载一些文件。用户从下拉列表中选择文件，然后按下按钮执行下载。代码如下：

function downloadApp()
{
var dd = document.getElementById("OSselectDropdown");
var OSchoice = dd.options[dd.selectedIndex].value;
if (OSchoice == "win")
{
window.location.href = "https://" + top.location.host + "/download/win_install.exe";
}
if (OSchoice == "mac")
{
window.location.href = "https://" + top.location.host + "/download/mac_install.pkg";
}
if (OSchoice == "linux")
{
window.location.href = "https://" + top.location.host + "/download/linux_install.tar.gz";
}

我想要实现的是，一旦下载开始，用户就会被带到一个新的页面。然而，我看不出如何做到这一点，因为下载本身本质上已经是使用window.location.href重定向到可下载文件的位置。一旦处理完，似乎就不可能让Javascript执行第二个window.location.href。

理想情况下，下载将开始，然后用户将自动出现在我指定的新页面上，而下载将作为后台过程继续。

更理想的是，在新的页面上，我想附上一条信息，说"谢谢你的下载"。只有当用户在完成下载过程后被带到该页面时，该消息才会出现在该页面上。

我努力实现的目标可能实现吗？

(我确实看到这个网站上有很多重定向和下载的条目，但是，这似乎是一个细节很重要的问题，据我所知，没有一个与我的情况非常吻合。)

Answer 1

首先使用-将用户重定向到感谢页面

window.location = thankYouPageURL; 

您可以为每个操作系统保留不同的URL，也可以在get中传递参数，并使用某个库在JavaScript端处理get参数。

或者使用hash在同一页面上导航到另一个部分。

location.hash = "#" + thankYouHash;

您还可以为此制作div覆盖或类似的方法。在选择下载选项后，切换thankYouDiv的可见性并隐藏存在下载选项的前一个div。

在感谢页面/div/hash上，使用新窗口或iframe开始下载。

IFRAME-

function startDownload(downloadUrl) {
var downloadFrame = document.createElement("iframe"); 
downloadFrame.setAttribute('src',downloadUrl);
downloadFrame.setAttribute('style',"border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;"); 
document.body.appendChild(downloadFrame);  
}

下载窗口-

function startDownload(downloadUrl) {
window.open(downloadUrl, 'download_window', 'toolbar=0,location=no,directories=0,status=0,scrollbars=0,resizeable=0,width=1,height=1,top=0,left=0');
window.focus();
}

Answer 2

尝试location.href而不是window.location.href