jqueryajax实现批量上传图片

《jqueryajax实现批量上传图片》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、先看效果图 点击增加按钮，会增加一个选择框，如下图： 选择要上传的图片，效果图如下： 上传成功如下图：  下面来看代码：前台html主要代码：确定上传  取消 &nbs

2、p;增加        图片1：                                因为用了JQuery

3、，所以你完全可以把click事件放在js文件中“增加”按钮js代码：varTfileUploadNum=1;//记录图片选择框个数varTnum=1;//ajax上传图片时索引        functionTAddFileUpload()        ...{                  varidnum=TfileUploadNum+1;                  varstr="图片"+idnum+"：";                  str+="

4、nputname=''size='60'id='uploadImg"+idnum+"'type='file'/>";                  str+="";                  $("#imgTable").append(str);                  TfileUploadNum+=1;        }“确定上传”按钮js代码：  functionTSubmitUploadImageFile()        ...{     

5、             M("SubUpload").disabled=true;                  M("CancelUpload").disabled=true;                  M("AddUpload").disabled=true;                  setTimeout("TajaxFileUpload()",1000);//此为关键代码}关于setTimeout("TajaxFileUpload()",1000);这句代码：因为所谓的批量上传，其实还是一个一个的上传，给用户的只是一个假象。只所以要延时执行T

6、ajaxFileUpload()，是因为在把图片上传到服务器上时，我在后台给图片重新命名了，命名的规则是，如下代码：Randomrd=newRandom();StringBuilderserial=newStringBuilder();serial.Append(DateTime.Now.ToString("yyyyMMddHHmmssff"));serial.Append(rd.Next(0,999999).ToString());returnserial.ToString();即使我命名精确到毫秒，另外再加上随机数，可是还是有上传的第二张图片把上传的第一张图片覆盖的情

7、况出现。所以此处我设置了延时1秒后在上传下一张图片。刚开始做这个东西的时候，用的是for循环，来把所有的图片一个一个的循环地用ajax上传，可是for循环速度太快了，可能第一张图片还没来得及ajax，第二张就被for过来了，还是有第二张覆盖第一张的情况出现。下面来看TajaxFileUpload()函数，代码如下：functionTajaxFileUpload()        ...{                  if(Tnum