webupload 多个实例化上传按钮
来源:互联网 发布:魔钢歼灭者淘宝价格 编辑:程序博客网 时间:2024/05/21 18:45
工作中用到的一个前端的插件webupload,由于页面中有不确定数量的上传图片的按钮。刚开始我试着把这个插件封装,结果……欲哭无泪呀,上传不了,整个页面的上传按钮都不好使。最后在文档中,发现了addButton这个参数,终于解决了问题。不说了,直接上代码
var uploader = WebUploader.create({ // 选完文件后,是否自动上传。 auto: true, // swf文件路径 swf: BASE_URL + 'assets/admin-tools/webuploader_fex/dist/Uploader.swf', // 文件接收服务端。 server: 'url', duplicate : true, // 选择文件的按钮。可选。 // 内部根据当前运行是创建,可能是input元素,也可能是flash. pick: '#filePicker', fileVal: 'image', //服务端File对应的名称。 // 只允许选择图片文件。 accept: { title: 'Image', extensions: 'gif,jpg,jpeg,bmp,png', mimeTypes: 'image/*' } }); // 文件上传成功,给item添加成功class, 用样式标记上传成功。 uploader.on( 'uploadSuccess', function( file, obj ) { //如果你上传成功需要对某一个文本框赋值 以$("#rt_"+file.source.ruid)为对象找到需要赋值的文本框 $("#rt_"+file.source.ruid).parent().next().val(obj.name); 成功执行的代码 }); // 文件上传失败,显示上传出错。 uploader.on( 'uploadError', function( file ) { //失败执行的代码 }); //计算出需要多少个实例化的按钮 var boxes_len = $(".class").length; //循环实例化页面的上传按钮 for(var i=1; i<=boxes_len ;i++){ uploader.addButton({ id : "#filePicker"+(i),//必须唯一 innerHTML : '选择图片', }); }
0 0
- webupload 多个实例化上传按钮
- WebUpload 视频上传,支持多视频上传
- 图片上传之WebUpload插件多图上传
- Webupload 文件上传
- WebUpload文件上传
- webupload 上传文件
- webupload 上传插件-图片上传
- Servlet实现webupload文件上传
- Webupload+PHP上传大文件
- webupload大文件分片上传
- WebUpload
- 一个按钮实现上传多个图片
- 一个按钮实现上传多个图片
- 动态添加上传按钮,上传多个文件
- 百度上传控件webUPload 的使用
- webupload flash上传和整合springmvc
- webupload大文件上传的坑
- 大文件上传插件webupload插件
- 用angular-file-upload在上传文件的时候动态设置一同发送的参数
- react教程之this.props.children
- 编写Backbone.js的第一个应用,相当于Hello World!
- yii2yii2的jquery
- Find The Multiple poj 1426 bfs
- webupload 多个实例化上传按钮
- Vuex 笔记
- jQuery实现轮播图特效,仿京东——李帅醒博客
- JavaIP小练习
- state传参数
- linux编程之GDB调试
- switch语句语法演示
- 用YOLOv2模型训练VOC数据集
- angular输入框点击全选