webuploader是什么?
下面是来自官网的介绍:
WebUploader是由Baidu WebFE(FEX)团队开发的一个简单的以HTML5为主,FLASH为辅的现代文件上传组件。在现代的浏览器里面能充分发挥HTML5的优势,同时又不摒弃主流IE浏览器,沿用原来的FLASH运行时,兼容IE6+,iOS 6+, android 4+。
webuploader比较常用的功能就是大文件分片上传,在上传的过程中会有一些冷门用法,下面慢慢为你讲解:
1.大文件上传,如何生成唯一文件名?
这个问题在我一以前的另一篇文章中有详细说明这里就不在重复。详见一下地址:
https://www.toutiao.com/article/6434488759991468290/
2.如何绑定多个上传按钮?
为什么会产生这个问题?比如页面中会有多个资料需要上传如下图:
图1
那如何解决这个问题,你也可以实例化多个webuploader ,但是显然这不是个好的方法(因为个数不是定死的),webuploader默认通过pick属性绑定一个按钮,不过webuploader提供了一个方法可以绑定多个按钮。方法如下:
uploader.addButton({
id: '#up' + i
});
由上面的多个上传按钮引发了下面这个问题。
3.如何判断我是点击的哪个上传按钮呢?
使用下面的方法就可以得到当前上传按钮的对象
$('#rt_' + file.source.ruid).parent()
//具体用法如下:
uploader.onUploadBeforeSend = function(obj, data, headers) {
var button = $('#rt_' + obj.file.source.ruid).parent()
};
4.判断是哪个按钮有了?那么每个按钮上传时附带不同的参入如何实现呢(比如图一中的textarea的值)?
既然能获得到当前选择的是哪个上传按钮,那么我们可以获取这行的文本域的值,但是如何和上传文件一起提交呢?请参考以下方法:
uploader.onUploadBeforeSend = function(obj, data, headers) {
data.text = $('#rt_' + obj.file.source.ruid).parent().parent().find('textarea').val();
//这里还可以添加其他参数
};
onUploadBeforeSend是webuploader的一个方法,表示上传之前的处理你可以在这里附加你的额外的参数。
上面这些用法希望对你有帮助。
留言与评论(共有 0 条评论) “” |