1. 程式人生 > >js下載檔案簡單操作

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 
版權宣告:本文為博主原創文章,轉載請附上博文連結!