2012-04-06 519 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"); 

})