jQuery --- 利用a标签的download属性下载文件！

最近遇到一个项目，需要有点击下载文件的功能。

由于文件格式是多种的，对于 rar / zip / rtf / doc / xlsx / jpg等。点击下载有的是直接跳转到后进行下载，但有的是打开进行预览，例如：txt / img / pdf 这些文件的下载可以使用 a 标签的download 属性来进行下载：

参考：

http://www.w3school.com.cn/tags/att_a_download.asp

https://blog.csdn.net/cynl7/article/details/78785697

具体实现：

<foreach name="data.attachment" item="v">

<li class="o">

    <a style="color:#959595;" href="{$v.path}" download="{$v.name}" data-name="{$v.name}" class="fr">下载</a>

    <a style="color:#959595;" href="{$v.path}" download="{$v.name}" data-name="{$v.name}" class="fl ts300">{$v.name}</a>

</li>

</foreach>

下面是用JS实现的：

<ul class="ziZhilist">

    <foreach name="data.attachment" item="v">

    <li class="o">

        <a href="javascript:;" style="color:#959595;" data-href="{$v.path}" data-name="{$v.name}" class="fr">下载</a>

        <a href="javascript:;" style="color:#959595;" data-href="{$v.path}" data-name="{$v.name}" class="fl ts300">{$v.name}</a>

    </li>

    </foreach>

</ul>

<script type="text/javascript">

(function(){

var hostUrl = "http://"+"<?php echo $_SERVER['HTTP_HOST']; ?>";

$("ul.ziZhilist li").find("a").click(function(){

    var link = document.createElement('a');

    link.setAttribute("download",$(this).attr("data-name"));

    link.href = hostUrl+$(this).attr("data-href");

    link.click();

});

})();

</script>

这种方法还是比较简单的。

巴特西

jQuery --- 利用a标签的download属性下载文件！

最新文章

热门文章