thinkphp3.2处理多张图片上传
原创
在做后台图片编辑和上传的时候往往会遇到比较棘手的问题，就是如何上传多张图片，本来以为要在input后面加个按钮，判断要添加的时候，在创一个input，这样子的话每个图片都有自己一个对应的name,这样后台便会拿到图片的路径。
不用以上方法，其实也很简单：
1.我们在表单form那里用数组去保存图片的name,再加上一个multiple,这样按住ctrl就可以多选了。
<input class="pic" id="intro_pic" name="intro_pic[]" type='file' multiple="multiple" placeholder="">2.我们通过ajax异步提交表单的数据，但是这里要注意的是图片的数据不能通过序列化的形式提交上去，数据流不一样，要实例化formdata提交
var formData=new FormData($("#user_form")[0]);
$.ajax({
type: "POST",
url: "<{:U('Admin/GameManager/Game/addGame')}>",
dataType: 'json',
processData: false,//去掉默认值
contentType: false,//去掉默认值
cache: false,
data: formData,
success:function(r){
if(r.success){
alert('添加成功');
window.location.reload();//重新刷新一次
$('#user_dialog').modal('hide');
}
else{
alert("参数错误");
}
}
});
3.如上操作就可以发往控制器了，在控制器我写了一个公共函数去处理图片
public function uploaldPic($data,$file){
$upload = new \Think\Upload();// 实例化上传类
$upload->maxSize = 3145728 ;// 设置附件上传大小
$upload->exts = array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型
$upload->rootPath = './upload/'; // 设置附件上传根目录
$upload->savePath = ''; // 设置附件上传（子）目录
$upload->thumb = true;
// 设置引用图片类库包路径
$upload->imageClassPath = '@.ORG.Image';
//设置需要生成缩略图的文件后缀
$upload->thumbPrefix = 'm_';
//设置缩略图最大宽度
$upload->thumbMaxWidth = '200,100';
//设置缩略图最大高度
$upload->thumbMaxHeight = '200,100';
//设置上传文件规则
$upload->saveRule = 'uniqid';
$upload->replace = true;
//删除原图
$upload->thumbRemoveOrigin = true;
// 上传文件
$info=array();
$a = '';
//通过遍历把刚刚存入的图片。依次拼成图片路径，你们可以通过var_dump去查看输去内容
foreach ($file['intro_pic']['name'] as $key=>$value){
$file1=array();
$file1["intro_pic"]['name']=$value;
$file1["intro_pic"]['type']=$file['intro_pic']["type"][$key];
$file1["intro_pic"]['tmp_name']=$file['intro_pic']["tmp_name"][$key];
$file1["intro_pic"]['error']=$file['intro_pic']["error"][$key];
$file1["intro_pic"]['size']=$file['intro_pic']["size"][$key];
$info = $upload->upload($file1);
foreach ($info as $key=>$value)
{
$a.="#".$value['savepath'].$value['savename'];//我用符号把图片路径拼起来
}
}
//把第一个#去掉，同时写进data数据库里面的intro_pic字段
$data["intro_pic"]=substr($a,1);
$info1 = $upload->upload();
foreach ($info1 as $key=>$value)
{
$data["$key"]=$value['savepath'].$value['savename'];
}
return $data;
}4.以上我们就存到我们的数据库了，那我们怎么把他们显示到视图上呢， 这个很简单了， 把图片路径用#切割一次，给视图做一次循环输出路径就可以，其中$result是查询返回的数据，包括图片字段。
foreach($result as $key =>$value){
$result[$key]['intro_pic'] = explode("#",$value['intro_pic']);//多张图片用#分开
}5.最后一步，视图遍历
<foreach name="game_list" item="item">
<td class="text-left">//对该字段多张图片遍历，GAME_PATH是我自己定义的路径
<foreach name="item['intro_pic']" item="item_child"> <img src="<{:C('GAME_PATH')}><{$item_child}>"> </foreach>
</td>
</foreach>6.我是前端小白，给我一个赞我会充满动力0.0
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
评论
登录后参与评论
推荐阅读
相关产品与服务
图片处理
图片处理（Image Processing，IP）是由腾讯云数据万象提供的丰富的图片处理服务，广泛应用于腾讯内部各产品。支持对腾讯云对象存储 COS 或第三方源的图片进行处理，提供基础处理能力（图片裁剪、转格式、缩放、打水印等）、图片瘦身能力（Guetzli 压缩、AVIF 转码压缩）、盲水印版权保护能力，同时支持先进的图像 AI 功能（图像增强、图像标签、图像评分、图像修复、商品抠图等），满足多种业务场景下的图片处理需求。