其实，多张图片上传功能跟单张图片上传功能一样，只不过多了一个遍历的过程罢了，我之前写过一篇比较适合大众化的多图片上传功能，今天来对thinkPHP框架多图片上传功能做一个分析，首先我们来看下单张图片上传的代码。
点击上传HTML
<tr>
<td class="tableleft">封面</td>
<td>
<input id="thumbnail" type="text" name="pic" class="form-control modal-sm" readonly="readonly" />
<input type="button" value="上传封面图" onclick="centerWindow('__URL__/uplife','upfile','400','200')" />
<img id="photo" name="photo" style="display:none;width:30%;" /> ( * 必须是jpg,gif,png，并且200k内)
</td>
</tr>弹窗HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>上传文件</title>
</head>
<body>
<form action="{:U('Admin/Product/upload')}" enctype="multipart/form-data" method="post" style="text-align:center;margin:30px;">
<input type="file" name="photo" />
<input type="hidden" name="MAX_FILE_SIZE" value="204800" />
<input type="hidden" name="type" value="proimg"/>
<input type="submit" value="确定上传">
</form>
</body>
</html>单张upload方法
public function upload(){
$type=$_POST['type'];
$upload = new \Think\Upload();// 实例化上传类
$upload->maxSize = 3145728 ;// 设置附件上传大小
$upload->exts = array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型
$upload->rootPath = './Upload/image/'.$type.'/'; // 设置附件上传根目录
$upload->savePath = ''; // 设置附件上传（子）目录
$upload->subName = array('date','Ymd');
$upload->saveName = array('uniqid','');
// $upload->saveName = '';
// 上传文件
$info = $upload->upload();
$data['pubtime'] = NOW_TIME;
if(!$info) {// 上传错误提示错误信息
$this->error($upload->getError());
}else{// 上传成功
// die(var_dump($type));
if($type=='proimg'){
$data['path'] = '/Upload/image/proimg/'.$info['photo']['savepath'].$info['photo']['savename'];
$this->alertOpenerClose($data['path']);
}elseif($type=='newsimg'){
$data['path'] = '/Upload/image/newsimg/'.$info['photo']['savepath'].$info['photo']['savename'];
$this->alertOpenerClose($data['path']);
}elseif($type=='honorimg'){
$data['path'] = '/Upload/image/honorimg/'.$info['photo']['savepath'].$info['photo']['savename'];
$this->alertOpenerClose($data['path']);
}
}
}
public function alertOpenerClose($_path){
echo "<script type='text/javascript'>alert('上传完成');</script>";
echo "<script type='text/javascript'>window.opener.document.getElementById('thumbnail').value ='$_path';</script>";
echo "<script type='text/javascript'>window.opener.document.getElementById('photo').style.display='block';</script>";
echo "<script type='text/javascript'>window.opener.document.getElementById('photo').src='$_path';</script>";
echo "<script type='text/javascript'>window.close();</script>";
exit();
}
下面是多张图片的上传代码
点击HTML
<tr>
<td class="tableleft">封面</td>
<td>
<input id="thumbnail" type="text" name="pic" class="form-control modal-sm" readonly="readonly" />
<input type="button" value="上传封面图" onclick="centerWindow('__URL__/uplife','upfile','400','200')" />
<div id="photo" name="photo" style="display:none;width:30%;" /> </div>( * 必须是jpg,gif,png，并且200k内)
</td>
</tr>弹窗HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>上传文件</title>
</head>
<body>
<form action="{:U('Admin/Product/upload')}" enctype="multipart/form-data" method="post" style="text-align:center;margin:30px;">
<input type="file" name="photo[]" multiple/>
<input type="hidden" name="MAX_FILE_SIZE" value="204800" />
<input type="hidden" name="type" value="proimg"/>
<input type="submit" value="确定上传">
</form>
</body>
</html>从中我们对比上面的html代码，我们不难发现这行input不一样
<input type="file" name="photo[]" multiple/>
那么对于的$info=$upload->upload()就是一个多维数组，同时发现服务器文件夹已经多了三张图片
多张图片处理方法
public function alertOpenerCloses($arr){//传递过来的数组
$pathstr=implode('%',$arr);
foreach ($arr as $key => $value) {
$imgstr.='<img src='.$value.' style="width:30%;" />';
}
echo "<script type='text/javascript'>alert('上传完成');</script>";
echo "<script type='text/javascript'>window.opener.document.getElementById('thumbnail').value ='$pathstr';</script>";
echo "<script type='text/javascript'>window.opener.document.getElementById('photo').style.display='block';</script>";
echo "<script type='text/javascript'>window.opener.document.getElementById('photo').innerHTML='$imgstr';</script>";
//innerHtml传入图片到点击后的html页面
echo "<script type='text/javascript'>window.close();</script>";
exit();
}
public function uploads(){
$type=$_POST['type'];
$upload = new \Think\Upload();// 实例化上传类
$upload->maxSize = 3145728 ;// 设置附件上传大小
$upload->exts = array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型
$upload->rootPath = './Upload/image/'.$type.'/'; // 设置附件上传根目录
$upload->savePath = ''; // 设置附件上传（子）目录
$upload->subName = array('date','Ymd');
$upload->saveName = array('uniqid','');
// $upload->saveName = '';
// 上传文件
$info = $upload->upload();
$data['pubtime'] = NOW_TIME;
if(!$info) {// 上传错误提示错误信息
$this->error($upload->getError());
}else{// 上传成功
// die(var_dump($type));
if($type=='proimg'){
foreach ($info as $key => $value) {
$srcarr[]='/Upload/image/proimg/'.$value['savepath'].$value['savename'];//每个上传路径重新组成数组
}
$this->alertOpenerCloses($srcarr);
}
}
}最后的上传效果图如下所示
上面提及到的大众化的多张图片上传功能的介绍，请查阅：PHP实现一次性多张图片上传功能
