zoukankan      html  css  js  c++  java
  • 文件夹批量下载插件webupload插件

    需求:

    支持文件批量下载。

    使用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批量下载/

  • 相关阅读:
    高级数据类型--字典(dict)
    一些JS常用的方法
    怎样提高WebService的性能
    Microsoft Enterprise Library 5.0 系列(三)
    Microsoft Enterprise Library 5.0 系列(四)
    Expression Blend学习二UI布局
    Expression Blend学习四控件
    Expression Blend学习5控件
    Expression Blend学习动画基础
    WPF三维图形
  • 原文地址:https://www.cnblogs.com/songsu/p/13404181.html
Copyright © 2011-2022 走看看