zoukankan      html  css  js  c++  java
  • b/s批量下载文件

    需求:

    支持文件批量下载。

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

    服务器不需要打包。

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

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

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

    js代码

    <script type="text/javascript">

        //全选控制   

        $(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);

        });

    </script>

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

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

    引入头文件

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>donw2-多文件演示页面</title>

        <link type="text/css" href="js/down.css" rel="Stylesheet" />

        <script type="text/javascript" src="js/jquery-1.4.min.js"></script>

        <script type="text/javascript" src="js/down.app.js" charset="utf-8"></script>

        <script type="text/javascript" src="js/down.edge.js" charset="utf-8"></script>

        <script type="text/javascript" src="js/down.file.js" charset="utf-8"></script>

        <script type="text/javascript" src="js/down.folder.js" charset="utf-8"></script>

        <script type="text/javascript" src="js/down.js" charset="utf-8"></script>

    </head>

    效果:

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

  • 相关阅读:
    Java实现 蓝桥杯VIP 基础练习 回形取数
    Java实现 蓝桥杯VIP 基础练习 回形取数
    Java实现 蓝桥杯VIP 基础练习 回形取数
    Java实现 蓝桥杯VIP 基础练习 回形取数
    Java实现 蓝桥杯VIP 基础练习 报时助手
    Java实现 蓝桥杯VIP 基础练习 报时助手
    Java实现 蓝桥杯VIP 基础练习 报时助手
    Java实现 蓝桥杯VIP 基础练习 报时助手
    Java实现 蓝桥杯VIP 基础练习 报时助手
    block的是发送信号的线程,又不是处理槽函数的线程
  • 原文地址:https://www.cnblogs.com/songsu/p/13331063.html
Copyright © 2011-2022 走看看