我在这里指定了一个非常类似的需求。
我需要有用户的浏览器手动启动下载时$('a#someID').click();
但是我不能用窗户。Href方法，因为它将当前页面内容替换为您试图下载的文件。
相反，我想在新窗口/标签中打开下载。这怎么可能呢?
当前回答
仅仅7年之后，这里出现了一行jQuery解决方案，使用表单而不是iframe或链接:
$('<form></form>')
.attr('action', filePath)
.appendTo('body').submit().remove();
我已经测试过了
Chrome 55 Firefox 50 边缘IE8-10 iOS 10 (Safari/Chrome) Android浏览器
如果有人知道这个解决方案的任何缺点，我很乐意听听。
完整的演示:
<html>
<head><script src="https://code.jquery.com/jquery-1.11.3.js"></script></head>
<body>
<script>
var filePath = window.prompt("Enter a file URL","http://jqueryui.com/resources/download/jquery-ui-1.12.1.zip");
$('<form></form>').attr('action', filePath).appendTo('body').submit().remove();
</script>
</body>
</html>
其他回答
function downloadURI(uri, name)
{
var link = document.createElement("a");
// If you don't know the name or want to use
// the webserver default set name = ''
link.setAttribute('download', name);
link.href = uri;
document.body.appendChild(link);
link.click();
link.remove();
}
检查您的目标浏览器是否能够顺利运行上面的代码片段:http://caniuse.com/#feat=download
为了改进Imagine Breaker的答案，FF和IE支持:
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
function downloadURI(uri, name) {
var link = document.createElement("a");
link.download = name;
link.href = uri;
link.dispatchEvent(evt);
}
换句话说，只需使用dispatchEvent函数而不是click();
您可以简单地使用HTML中的Download属性。使用优秀的Javascript，你可以使用这个功能直接下载文件。锚标记的download属性应该指向要下载的文件所在的链接。
首先，将URL指向资源路径:
var url = 'your url goes here';
创建一个锚标记，需要的属性如下所示:
var elem = document.createElement('a');
elem.href = url;
elem.download = url;
elem.id="downloadAnchor";
将锚标记附加到网页的body元素。
document.body.appendChild(elem);
现在以编程方式触发单击事件。点击锚标记将触发下载。
$('#downloadAnchor').click();
把它们放在一起:
var url = 'your url goes here';
var elem = document.createElement('a');
elem.href = url;
elem.download = url;
elem.id="downloadAnchor";
document.body.appendChild(elem);
$('#downloadAnchor').click();
附加信息:上面的代码没有什么奇特的，只是从Chrome Devtools的控制台工作的客户端JavaScript，但功能强大，也开辟了许多可能性，如网页爬行。
例如，下面这段在Devtools控制台中执行的代码将在一个新的选项卡中打开页面中的所有链接:只要进入这个网页，打开Devtools并在浏览器控制台中运行这个脚本，就可以看到JavaScript的强大威力了。(注意:下面的代码仅用于教学目的。)
确保你为该网站启用了弹出窗口，否则你的锚点点击将被默认的弹出窗口拦截器禁用。
var links = document.getElementsByClassName("_3ATBKe");
for(var i=0;i<links.length;i++){
var title = document.getElementsByClassName("_3ATBKe")[i].firstElementChild.firstElementChild.innerText.replaceAll('|','-').replaceAll(':','x');
console.log('Opening..'+title);
links[i].firstElementChild.click();
}
注意:这不仅仅局限于点击锚，你可以下载几乎任何你在你的网页上找到的东西。如果某些东西(图像、音频、视频)加载到你的网页上，你可以编写一个脚本来下载它，即使UI没有提供给你。
我建议您使用mousedown事件，它被称为BEFORE the click事件。这样，浏览器就可以自然地处理点击事件，从而避免了任何奇怪的代码:
(function ($) {
// with this solution, the browser handles the download link naturally (tested in chrome and firefox)
$(document).ready(function () {
var url = '/private/downloads/myfile123.pdf';
$("a#someID").on('mousedown', function () {
$(this).attr("href", url);
});
});
})(jQuery);
使用iframe的简单示例
function downloadURL(url) {
var hiddenIFrameID = 'hiddenDownloader',
iframe = document.getElementById(hiddenIFrameID);
if (iframe === null) {
iframe = document.createElement('iframe');
iframe.id = hiddenIFrameID;
iframe.style.display = 'none';
document.body.appendChild(iframe);
}
iframe.src = url;
};
然后在任何你想要的地方调用这个函数:
downloadURL(“path / to /我的文件”);
