首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >Git 项目推荐 | html5 异步批量上传插件

Git 项目推荐 | html5 异步批量上传插件

作者头像
码云Gitee
发布于 2018-03-29 11:02:35
发布于 2018-03-29 11:02:35
1.6K0
举报
文章被收录于专栏:开源项目开源项目

使用html5的ajax批量上传的工具 。

插件描述:

javascript异步上传插件,包含3个子项目BUpload, JUpload, TUpload.

  • BUpload : 基于HTML5, UI仿百度编辑器的图片上传, 支持图片上传,浏览图片,和图片搜索,支持图片预览,有进度条
  • TUpload : 基于HTML5, UI仿腾讯的QQ空间上传图片,支持图片预览,有进度条。
  • JUpload : 基于iframe的异步上传。

插件依赖:

  • jQuery-1.7.1以上版本

使用demo

BUpload
代码语言:javascript
复制
    $("#upload-btn").on("click", function() {

        new BUpload({
            upload_url : "upload.php",
            list_url : "image_list.php",    //图片列表数据获取url
            search_url : "image_search.php",    //图片搜索页面url
            max_filesize : 1024,
            max_filenum : 10,
            callback : function(data) {
                $.each(data, function(idx, item) {
                    $("#image-box").append('<img src="'+item+'" width="200" />');
                });
                console.log(data);
            }
        });

    });
TUpload
代码语言:javascript
复制
    $("#upload-btn").on("click", function() {

        new TUpload({
                uploadUrl : "upload.php",
                maxFileSize : 1024,
                maxFileNum : 20,
                callback : function(data) {
                    $.each(data, function(idx, item) {
                        $("#image-box").append('<img src="'+item+'" width="200" />');
                    });
                    console.log(data);
                }
            });

    });
JUpload
代码语言:javascript
复制
    $("#upload-btn").JUpload({
        url : "upload.php",
        src : "src",
        image_container : "image-box"
    });

    $("#upload-btn2").JUpload({
        url : "upload.php",
        src : "src",
        callback : function(data) {
            $("#img-src").val(data.message);
        }
    });
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2016-06-07,如有侵权请联系 cloudcommunity@tencent.com 删除
目录
  • 使用html5的ajax批量上传的工具 。
  • 插件描述:
  • 插件依赖:
  • 使用demo
    • BUpload
    • TUpload
    • JUpload
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档