Thinkphp 使用webUpload插件多图上传

我只是代码的搬运工，参考其他人的零散整合。滇东之鹰大神整合的代码
html 部分
主要做了个隐藏域 方便jq 传值进入form表单

js
(function( $ ){
      // 当domReady的时候开始初始化
      $(function() {
         var $wrap = $('.uploader-list-container'),
            // 图片容器
            $queue = $( '
控制器 代码

点击上传按钮时进入到webupload 方法 配置好路径进行存储过滤
最重要的 使用ajaxReturn返回json数据传到js 里面

//商品图片上传
    public function webUpload(){
    $config = array(
        'mimes'         =>  array(), //允许上传的文件MiMe类型
        'maxSize'       =>  0, //上传的文件大小限制 (0-不做限制)
        'exts'          =>  array('jpg', 'gif', 'png', 'jpeg'), //允许上传的文件后缀
        'autoSub'       =>  true, //自动子目录保存文件
        'subName'       =>  array('date', 'Y-m-d'), //子目录创建方式，[0]-函数名，[1]-参数，多个参数使用数组
        'rootPath'      =>  'Upload/', //保存根路径
        'savePath'      =>  'Goods/',//保存路径
    );
    $upload = new \Think\Upload($config);// 实例化上传类
    $info   =   $upload->upload();
    if(!$info) {
        $this->error($upload->getError());// 上传错误提示错误信息
    }else{// 上传成功
        foreach ($info as $va){
                $suoluetu.="./Upload/".$va['savepath'].$va['savename']."||";
                $this->ajaxReturn($suoluetu);
        }
    }
}
js 接收

使用 uploadSuccess 方法接收返回信息
使用response 获取图片接收地址
使用jq earch 方法 循环遍历图片地址
定义 arr 数组 必须放在方法体外声明全局数组
使用.push() 进行添加遍历的元素
最后将 arr 添加到 html界面隐藏域里面

//ajax 成功返回地址
var arr    =  []; //定义全局数组
uploader.on('uploadSuccess',function(file,response){

   var imgurl = response; //上传图片的路径

   $(".imgfirst").each(function(){  //使用foreach 循环 地址
  arr.push(imgurl);   //地址追加进数组

   });

   $(".imgfirst").val(arr); //将地址写入到form表单
});

这样多图上传基本完成[/code]

tp.zip ( 5.87 MB 下载：16 次 )