图片预览上传插件bootstrap-fileinput.js

所属分类:输入,其他-上传

 84260  493  查看评论 (99)
分享到微信朋友圈
X
图片预览上传插件bootstrap-fileinput.js ie兼容9

更新时间:2017/12/22 下午5:12:09

更新说明:修改错误,之前把form标签id和enctype写到div上了


引入css

<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-fileinput.css" rel="stylesheet">

引入js

<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="js/bootstrap-fileinput.js"></script>
<script type="text/javascript">
    $(function() {
        //比较简洁,细节可自行完善        
        $('#uploadSubmit').click(function() {
            var data = new FormData($('#uploadForm')[0]);
            $.ajax({
                url: 'xxx/xxx',
                type: 'POST',
                data: data,
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                success: function(data) {
                    console.log(data);
                    if (data.status) {
                        console.log('upload success');
                    } else {
                        console.log(data.message);
                    }
                },
                error: function(data) {
                    console.log(data.status);
                }
            });
        });
    })
</script>
相关插件-上传

jQuery多图上传带ajax提交

jQuery多图上传可删除,可以本地预览带前台接口
  上传
 80316  559

webuploader 上传插件(根据官方做了小改)

webuploader上传插件,上图之前图片可编辑、可随意排版上传图片顺序
  上传
 67489  473

jQuery仿淘宝管理商品批量图片上传插件

jQuery淘宝上传商品图片代码,批量上传插件,(不兼容IE6,7,8)
  上传
 65323  376

图片上传插件

图片上传插件
  上传
 85600  391

讨论这个项目(99)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    k6xiao 1
    2023/5/30 22:19:32

    BUG:当只上传1张图片时,提示至少上传两张,实际上已经设置了minFileCount: 1,    //最小文件个数
    修复:fileinput.js第1994行,

    data = new FileInput(this, $.extend({}, $.fn.fileinput.defaults, options, $(this).data()));

    改为

    data = new FileInput(this, $.extend({}, $.fn.fileinput.defaults, $(this).data(), options));
    回复
    G.怪蜀黍 0
    2020/2/19 23:07:36
    不错,很不错的插件 回复
    zhuchuanjun 0
    2019/7/3 11:43:54
    我想知道,这个fileninput.js上传文件,对于上传文件的名称长度可以做限制吗?有限制名称最长多少吗?太过于长会报错,怎么处理? 回复
    娃娃的娃娃 0
    2019/3/21 13:03:53
    谢谢分享,就是分要的多了点。
        右眸°remnant0
        2023/3/6 9:03:38
        知足吧
    回复
    rm -rf /* 0
    2019/2/21 13:57:13
    求分享445368087@qq.com 回复
    WOLF 0
    2019/2/9 21:11:34
    superdameng 0
    2019/1/9 17:27:22
    这个怎么在一个页面中同时使用两个插件? 回复
    123 0
    2018/11/6 16:59:51
    ?? 深水鱼?? 0
    2018/6/27 13:39:38
    还行吧割发代首 回复
    xTao 0
    2018/6/12 11:38:48
    可以分享到qq邮箱:1807205432@qq.com 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复