如何使用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 }