2012-04-06 295 views
17

如果用户点击一个下载链接,如更改名称

<a href="downloadable.txt">Download</a> 

有一个客户端(HTML或JavaScript)的方式“另存为前更改文件名'对话框?

+0

可能重复获得相同的经典的JavaScript html download](http://stackoverflow.com/questions/10037273/changing-the-name-of-an-html-download) – 2012-04-06 21:16:29

回答

5

不,您不能从客户端(HTML或JavaScript)更改此设置。您需要从服务器更改它。一种方法是使用服务器端脚本将设置内容处置HTTP响应头:

Content-Disposition: attachment; filename=somecustomname.txt 
+0

虽然不是客户端,这是我想要的效果。谢谢。 – Intra 2012-04-06 22:01:30

52

HTML5提供了a[download]属性,它可以让您重命名文件。此示例将下载link.txt并将其重命名为something.txt

​<a download="something.txt" href="link.txt">asdf</a>​​​​​​​​​​​​​​​​​​​​​​​​​​​ 

请注意,这只适用于同源URL(即不跨不同域)。

+0

不仅Chrome,它也适用于我的Firefox 28.0。 您可以在此处查看兼容性列表:http://caniuse.com/download – Bonswouar 2014-03-20 14:20:10

+0

从20.0版开始适用于Firefox,但仅适用于来自同一个域的文件(请参阅https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download) – deterb 2014-03-27 17:04:05

+0

http://caniuse.com/#feat=download现在Opera和Android浏览器支持。 – 2015-09-21 06:18:35

2

您可以使用eligrey书面Filesaver.js脚本(IM使用这里的例子angularjs) 可以使用XmlHttpRequest对象[更改的名称

//In your html code , add these : -> 
<script src="https://rawgit.com/eligrey/FileSaver.js/master/FileSaver.js" type="text/javascript"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular-animate.js"></script> 
//In your Javascript:- 

$http({ 
     url: "url where the file is located", 
     method: "GET", 
     responseType: "blob" 
    }).then(function (response) { 

saveAs(response.data,"newfilename.extension"); 

})