HTML+CSS入门 HTML如何无刷新下载文件-职坐标

HTML+CSS入门 HTML如何无刷新下载文件

沉沙 2018-05-29 来源：阅读 1109 评论 0

摘要：本文讲解了HTML无刷新下载文件的方法，希望阅读本篇文章以后大家有所收获，学会如何无刷新下载文件，帮助大家HTML+CSS入门。

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

使用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>

本文由职坐标整理并发布，了解更多内容，请关注职坐标WEB前端HTML/CSS频道！