HTML無刷新下載文件方法總彙

首先要保證有一個後臺能夠下載文件的方法，這裏只總結前端解決方法，因此不對後臺作分析，假設如今有一個下載文件的方法/project/download.action。若是不想經過後臺直接下載能夠看個人另外一篇文章《 html使用a標籤不經過後臺實現直接下載》。

1. 使用a標籤

   <a href="/project/download.action" target="_blank">點擊下載</a>

   這裏target屬性不給也能夠，可是頁面會閃一下，體驗很差。

2. 使用location.href屬性

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

3. 使用window.open

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

4. 使用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種方法，比較靈活。