分享一个基于webuploader的七牛多图上传的JS。
七牛要求的token与key我最后写。(PHP的,其他语言的自行翻文档)
话不多说,直接贴代码:articel.js
/**
* Created by Administrator on 2016/3/7.
*/
$(function () {
// 初始化Web Uploader
var uploader = WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: "/Public/Extend/webuploader/Uploader.swf",
// 文件接收服务端。(直接使用七牛)
server: "http://up.qiniu.com",//$("#hidUrl").val(),
// 选择文件的按钮。可选。
// 内部根据当前运行是创建,可能是input元素,也可能是flash.
pick: {
id:"#content_img",
lable:"<input type='button' class='btn' />",
multiple:true
},
// 只允许选择图片文件。
accept: {
title: 'Images',
extensions: 'gif,jpg,jpeg,bmp,png',
mimeTypes: 'image/*'
}
});
uploader.on( 'uploadSuccess', function(file,response ) {
//var id=$("#hidBtn").val();
if(response.key){
//alert(1);
$("input[name='bg_img']").val($("#hidUrl").val()+"/"+response.key);
var a_tag="<a title='点击查看' target='_blank' href='"+$("#hidUrl").val()+"/"+response.key+"'>上传成功</a>";
$("#tips").html(a_tag);
console.log($("#hidUrl").val()+"/"+response.key);
console.log("-");
}
//重置uploader,开启此选项后
//uploader.reset();
});
//生成多个token,file,此函数在多文件上传的时候只会被调用一次
uploader.on('filesQueued',function(files ){