JQuery+ajax实现批量上传图片

图片看不清楚？请点击这里查看原图（大图）。

下面来看代码：

前台html主要代码：

<button id="SubUpload" class="ManagerButton" onClick="TSubmitUploadImageFile();return false;">确定上传</button>　

<button id="CancelUpload" class="ManagerButton" onClick="javascript:history.go(-1);">取消</button>　

<button id="AddUpload" class="ManagerButton" onClick="TAddFileUpload();return false;">增加</button>

<tr><td class="tdClass">

图片1：

　　　　　　　　 </td><td class="tdClass">

　　　　　　　　 <input name="" size="60" id="uploadImg1" type="file" />

　　　　　　　　 <span id="uploadImgState1"></span>

　　　　　　　　 </td></tr>

因为用了JQuery，所以你完全可以把click事件放在js文件中

“增加”按钮js代码：

　 var TfileUploadNum=1; //记录图片选择框个数

var Tnum=1; //ajax上传图片时索引

　　　　　　　　 function TAddFileUpload()

　　　　　　　　 {

　　　　　　　　　　　　　　　　　　 var idnum = TfileUploadNum+1;

　　　　　　　　　　　　　　　　　　 var str="<tr><td class='tdClass'>图片"+idnum+"：</td>";

　　　　　　　　　　　　　　　　　　 str += "<td class='tdClass'><input name='' size='60' id='uploadImg"+idnum+"' type='file' /><span id='uploadImgState"+idnum+"'>";

　　　　　　　　　　　　　　　　　　 str += "</span></td></tr>";

　　　　　　　　　　　　　　　　　　 $("#imgTable").append(str);

　　　　　　　　　　　　　　　　　　 TfileUploadNum += 1;

　　　　　　　　 }