文件夹批量下载插件webupload插件

2021-01-14 22:12

阅读:625

标签:download   styles   name   路径   input   turn   files   char   mac   

需求:

支持文件批量下载。

使用JS能够实现批量下载,能够提供接口从指定url中下载文件并保存在本地指定路径中。

服务器不需要打包。

支持大文件断点下载。比如下载10G的文件。

PC端全平台支持。Windows,macOS,Linux

全浏览器支持。ie6,ie7,ie8,ie9,ie10,ie11,edge,firefox,chrome,safari

 

js代码

    //全选控制   

    $(document).ready(function() {

        $("#checkAll").click(function() {

            if ($("#checkAll").prop("checked")) {

                $("input[name=‘checkbox‘]").prop("checked", true);

            } else {

                $("input[name=‘checkbox‘]").prop("checked", false);

            }

        })

    });

 

    //批量下载

    $("#btn-down-files").click(function () {

        if (downer.Config["Folder"] == "") { downer.open_folder(); return; }

        var urls = [

            { fileUrl: "http://res2.ncmem.com/res/images/ie11.png" }

            , { fileUrl: "http://res2.ncmem.com/res/images/up6.1/down.png" }

            , { fileUrl: "http://res2.ncmem.com/res/images/firefox.png" }

            , { fileUrl: "http://res2.ncmem.com/res/images/edge.png" }

            , { fileUrl: "http://res2.ncmem.com/res/images/up6.1/cloud.png" }

            , { fileUrl: "http://res2.ncmem.com/res/images/home/w.png" }

            , { fileUrl: "http://res2.ncmem.com/res/images/img.png" }

        ];

        downer.app.addUrls(urls);

});

 

    //json数据下载

    $("#btn-down-json").click(function () {

        if (downer.Config["Folder"] == "") { downer.open_folder(); return; }

        var fd = {

            nameLoc: "图片列表"

            , files: [

                { fileUrl: "http://res2.ncmem.com/res/images/ie11.png" }

                , { fileUrl: "http://res2.ncmem.com/res/images/up6.1/down.png" }

                , { fileUrl: "http://res2.ncmem.com/res/images/firefox.png" }

                , { fileUrl: "http://res2.ncmem.com/res/images/edge.png" }

                , { fileUrl: "http://res2.ncmem.com/res/images/up6.1/cloud.png" }

                , { fileUrl: "http://res2.ncmem.com/res/images/home/w.png" }

                , { fileUrl: "http://res2.ncmem.com/res/images/img.png" }

            ]

        };

        downer.app.addJson(fd);

});

 

    //下载多级目录

    $("#btn-down-fd").click(function () {

        if (downer.Config["Folder"] == "") { downer.open_folder(); return; }

        var fd = {

            nameLoc: "测试文件夹"

            , files: [

                { fileUrl: "http://www.ncmem.com/images/ico-ftp.jpg" }

                , { fileUrl: "http://www.ncmem.com/images/ico-up.jpg" }

            ]

            , folders: [

                {

                    nameLoc: "图片1"

                    , files: [

                        { fileUrl: "http://www.ncmem.com/images/ico-ftp.jpg" }

                        , { fileUrl: "http://www.ncmem.com/images/ico-up.jpg" }

                        , { fileUrl: "http://www.ncmem.com/images/ico-capture.jpg" }

                        , { fileUrl: "http://www.ncmem.com/images/ico-imageuploader.gif" }

                        , { fileUrl: "http://www.ncmem.com/images/ico-wordpaster.gif" }

                    ]

                    , folders: [

                        {

                            nameLoc: "软件"

                            , files: [

                                { fileUrl: "http://res2.ncmem.com/res/images/edit-file.png" }

                            ]

                        }

                    ]

                }

            ]

        };

        downer.app.addJson(fd);

});

 

    //自定义下载数据,db/down.aspx负责提供数据

    $("#btn-down-svr").click(function () {

        if (downer.Config["Folder"] == "") { downer.open_folder(); return; }

        var urls = [

            { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "test.exe" }

            , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "test-1.exe" }

        ];

        downer.app.addUrls(urls);

});

 

    //自定义下载数据,db/down.aspx负责提供数据

    $("#btn-down-svr-fd").click(function () {

        if (downer.Config["Folder"] == "") { downer.open_folder(); return; }

        var fd = {

            nameLoc: "测试文件夹"

            , files: [

                { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-1.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-2.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-3.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-4.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-5.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-6.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-7.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-8.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-9.exe" }

                , { fileUrl: "http://localhost:90/db/down.aspx", nameLoc: "360-10.exe" }

            ]

        };

        downer.app.addJson(fd);

    });

function toUpload(){ $("input[type=checkbox]:checked:checked").each(function() { //由于复选框一般选中的是多个,所以可以循环输出

             if ($(this).val() != ""&&$(this).val()!="on") { window.open("${path }/test/download?id="+$(this).val(),"navTab"); } }); }

 

引入头文件

    

    

donw2-多文件演示页面

    

    

    

    

    

    

    

 

效果:

技术图片

 

网上例子:http://blog.ncmem.com/wordpress/2019/08/28/java批量下载/

 

文件夹批量下载插件webupload插件

标签:download   styles   name   路径   input   turn   files   char   mac   

原文地址:https://www.cnblogs.com/songsu/p/13404181.html

上一篇:httprunner测试框架

下一篇:CSS背景和列表


评论


亲,登录后才可以留言!