JS实现下载的常用方案

  如何使用JS实现异步下载吗?即:既能实现下载又不刷新页面。这时我们常常会想到使用ajax,但是由于ajax接受的response始终是字符串,因此并不能使用ajax来实现下载功能。

  常见是新建下载的方法为

  1,a标签

  2,url跳转,

  3,提交表单,

  其中a标签体验好些,其他两个会打开一个新标签再下载再关闭新标签,整个过程让人感觉眼花缭乱,因此推荐使用a标签实现下载功能。

 1 //使用表单下载
 2 function commDownload(url, method, params) {
 3     let formStr = `<form action="${url}" method="${method}" >`;
 4     for(let [key, value] of Object.entries(params)) {
 5         formStr += `<input type="text" name="${key}" value="${value}" />`;
 6     }
 7     formStr += "</form>";
 8     $(formStr).appendTo("body").submit().remove();
 9 }
10 
11 //使用url跳转下载
12 function commDownload2(url, params) {
13     url += "?";
14     for(let key in params) {
15         url += key + "=" + params[key] + "&";
16     }
17     url = url.substr(0, url.length - 1);
18     window.open(url);
19 }
20 
21 //使用a标签下载--推荐使用
22 function commDownload3(url, params) {
23     url += "?";
24     for(let key in params) {
25         url += key + "=" + params[key] + "&";
26     }
27     url = url.substr(0, url.length - 1);
28     $("<a href=" + url + " />")[0].click();
29 }

 

posted @ 2019-07-12 15:42  光何  阅读(2279)  评论(0编辑  收藏  举报