快捷搜索:

JQuery+ajax实现批量上传图片

在网上搜索了一下,发明以jquery+ajax要领实现单张图片上传的代码是有的,但实现批量上传图片的法度榜样却没搜索到,于是根据搜索到的代码,写了一个可以批量上传的。

先看效果图

  图片看不清楚?请点击这里查看原图(大年夜图)。

点击增添按钮,会增添一个选择框,如下图:

  图片看不清楚?请点击这里查看原图(大年夜图)。

选摘要上传的图片,效果图如下:

  图片看不清楚?请点击这里查看原图(大年夜图)。

上传成功如下图:

  图片看不清楚?请点击这里查看原图(大年夜图)。

  图片看不清楚?请点击这里查看原图(大年夜图)。

下面来看代码:

前台html主要代码:

确定上传

取消

增添

图片1:

由于用了JQuery,以是你完全可以把click事故放在js文件中

“增添”按钮js代码:

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

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

function TAddFileUpload()

{

var idnum = TfileUploadNum+1;

var str="

图片"+idnum+":";

str += "

";

str += "";

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

TfileUploadNum += 1;

}

function TajaxFileUpload()

{

if(Tnum

您可能还会对下面的文章感兴趣: