js下載檔案簡單操作
https://blog.csdn.net/zhoumengshun/article/details/71405963
版權宣告:本文為博主原創文章,未經博主允許不得轉載。 https://blog.csdn.net/zhoumengshun/article/details/71405963
一般下載
例如要下載檔案的地址為:htpp://127.0.0.1/test.rar
//該方法在火狐上沒有效果的,在IE瀏覽器上是可以的
window.open("htpp://127.0.0.1/test.rar");
//該方法火狐有些版本是不支援的
window.location.href="htpp://127.0.0.1/test.rar";
//為了解決火狐有些版本不支援,可以改成這種方式
window.location="htpp://127.0.0.1/test.rar";
//該方法IE和火狐都可以,
//url表示要下載的檔案路徑,如:htpp://127.0.0.1/test.rar
function downloadFile(url) {
try{
var elemIF = document.createElement("iframe");
elemIF.src = url;
elemIF.style.display = "none";
document.body.appendChild(elemIF);
}catch(e){
zzrw.alert("下載異常!");
}
}
//表單方式直接下載檔案
//url表示要下載的檔案路徑,如:htpp://127.0.0.1/test.rar
function downloadFile(url){
var form=$("<form>");//定義form表單,通過表單傳送請求
form.attr("style","display:none");//設定為不顯示
form.attr("target","");
form.attr("method","get");//設定請求型別
form.attr("action",url);//設定請求路徑
$("body").append(form);//新增表單到頁面(body)中
form.submit();//表單提交
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
不跳轉頁面請求後臺下載,後臺返回一個數據流,可通過表單實現
如下:
JQuery的ajax函式的返回型別只有xml、text、json、html等型別,沒有“流”型別,所以我們要實現ajax下載,不能夠使用相應的ajax函式進行檔案下載。但可以用js生成一個form,用這個form提交引數,並返回“流”型別的資料。在實現過程中,頁面也沒有進行重新整理。
get請求下載
//url表示請求路徑,進入後臺處理,後臺返回一個檔案流
//例如:url為htpp://127.0.0.1/test
function downloadFile(url){
//定義一個form表單,通過form表單來發送請求
var form=$("<form>");
//設定表單狀態為不顯示
form.attr("style","display:none");
//method屬性設定請求型別為get
form.attr("method","get");
//action屬性設定請求路徑,(如有需要,可直接在路徑後面跟引數)
//例如:htpp://127.0.0.1/test?id=123
form.attr("action",url);
//將表單放置在頁面(body)中
$("body").append(form);
//表單提交
form.submit();
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
post請求下載
//url表示請求路徑,進入後臺處理,後臺返回一個檔案流
//例如:url為htpp://127.0.0.1/test
function downloadFile(url){
//定義一個form表單,通過form表單來發送請求
var form=$("<form>");
//設定表單狀態為不顯示
form.attr("style","display:none");
//method屬性設定請求型別為post
form.attr("method","post");
//action屬性設定請求路徑,
//請求型別是post時,路徑後面跟引數的方式不可用
//可以通過表單中的input來傳遞引數
form.attr("action",url);
$("body").append(form);//將表單放置在web中
//在表單中新增input標籤來傳遞引數
//如有多個引數可新增多個input標籤
var input1=$("<input>");
input1.attr("type","hidden");//設定為隱藏域
input1.attr("name","id");//設定引數名稱
input1.attr("value","123");//設定引數值
form.append(input1);//新增到表單中
form.submit();//表單提交
}
---------------------
作者:周夢順
來源:CSDN
原文:https://blog.csdn.net/zhoumengshun/article/details/71405963
版權宣告:本文為博主原創文章,轉載請附上博文連結!