HTML无刷新下载文件方法总汇

首先要保证有一个后台可以下载文件的方法，这里只总结前端解决方法，所以不对后台做分析，假设现在有一个下载文件的方法

/project/download.action

。如果不想通过后台直接下载可以看我的另一篇文章《 html使用a标签不通过后台实现直接下载》。

使用a标签

<a href="/project/download.action" target="_blank">点击下载</a>

这里

target

属性不给也可以，但是页面会闪一下，体验不好。

使用location.href属性

function downloadFile(url){
location.href=url;
}

使用window.open

function downloadFile(url){
window.open(url);
}

使用iframe

//javascript版本
function downloadFile(url){
var iframe = document.createElement("iframe");
document.body.appendChild(iframe);
iframe.src =url;
}

//jQuery版本
function downloadFile(url){
$("body").append($("<iframe/>").attr("src",url);
}

调用

<a href="javascript:void(0);" onclick="downloadFile('/project/download.action')">点击下载</a>

个人推荐第4种方法，比较灵活。