php表单带多图上传,thinkphp框架表单数组实现图片批量上传功能示例

本文实例讲述了thinkphp框架表单数组实现图片批量上传功能。分享给大家供大家参考，具体如下：

今天做一个表单数组实现图片批量上传，js不是很会，在网上找了资料改的，html页面如下：

var i = 1;

function addElement(){

var tr = document.createElement('tr');

var td1=document.createElement("td");

var td2=document.createElement("td");

var td3=document.createElement("td");

var td4=document.createElement("td");

var td5=document.createElement("td");

var td6=document.createElement("td");

var td7=document.createElement("td");

td1.innerHTML="描述：";

td2.innerHTML="";

td3.innerHTML="图片：";

td4.innerHTML="请上传小于2M的图片";

td5.innerHTML="排序：";

td6.innerHTML="";

td7.innerHTML="增 加 | 删减";

tr.appendChild(td1);

tr.appendChild(td2);

tr.appendChild(td3);

tr.appendChild(td4);

tr.appendChild(td5);

tr.appendChild(td6);

tr.appendChild(td7);

tr.id = 'Elem'+i;

document.getElementById('pdr1').appendChild(tr);

i++;

}

function dropElement(){

var aaa = document.getElementById('Elem'+(i-1));

document.getElementById('pdr1').removeChild(aaa);

i--;

}

function checkForm()

{

for(k=i;k>=0;k--)

{

if(document.getElementById("image"+k).value=="")

{

alert("图片不能空");

return false;

}

}

}

border="0" id="pdr1">

描述： 图片：

scrolling=no BORDERCOLOR="#CCCCFF"

src="{:U('Upimg/upimgs','ind=0')}" style="vertical-align: middle;">

请上传小于2M的图片

排序： 增 加 | 删减

在做__APP__/Upimg/upimgs/ind/+ind这段时，刚开始我用的U()函数，但是把js变量i传入U()函数无法解析，所以在这里改为了url方式。

在获取表单数组并插入数据库时用循环遍历并写入数据库：

foreach($data['description'] as $key)

{

$data1['picid']=$fid;

$data1['description']=$data['description'][$i];

$data1['image']=$data['image'][$i];

$data1['px']=$data['px'][$i];

$result=$model->add($data1);

$i++;

}

$data是通过转换来的，可以直接用$_POST,做这个由于不熟悉js，所以在上面花了很多时间,刚开始我是用

var tr = document.createElement('tr');

tr.innerHTML= "

描述：";

tr.innerHTML+= "

";

tr.id = 'Elem'+i;

document.getElementById('pdr1').appendChild(tr);

但是ie不兼容，后又在网上找了上面的方法。

希望本文所述对大家基于ThinkPHP框架的PHP程序设计有所帮助。