ajaxFileUpload的使用

   最近在做一个微商城的项目涉及到一个图片的上传，起初是用jquery的ajax方法结果它不能解析enctype="multipart/form-data"，不能成功将type=file类型的数据传交给后台。后来在$.ajax方法中加了个enctype="multipart/form-data"后但是发现发出的请求地址错误，最终放弃了用jquery  ajxa的方法传送，最后选择了ajaxFileUpload的插件，虽然它你能够实现图片的上传，但其也存在着一定的bug，譬如：

①他不能支持多个图片的传输，要想支持必须在插件的源js文件中进行修改

/*
* 修改前
* var oldElement = jQuery('#' + fileElementId);
var newElement = jQuery(oldElement).clone();
jQuery(oldElement).attr('id', fileId);
jQuery(oldElement).before(newElement);
jQuery(oldElement).appendTo(form);*/

//修改后
for(var i in fileElementId){ 
var oldElement = jQuery('#' + fileElementId[i]);
var newElement = jQuery(oldElement).clone();
jQuery(oldElement).attr('id', fileId);
jQuery(oldElement).before(newElement);
jQuery(oldElement).appendTo(form);
}

②传表单数据只能以data :{comName:comName,comPrize:comPrize,comRepertory:comRepertory,comFreight:comFreight,comType:comType,merNo : merNo}而不能以表单形式传递

③成功提交数据后接收返回数据总是进入error方法，要进入成功方法则改js源文件

//修改前

if ( type == "json" )
        eval("data = "+data);//这里没有将data解析成json对象，网上有说改为eval( "data = \"" + data+"\"" );或者
        eval("data = eval(" + data + ")");但我改后都未成功，直到最后看到某博客后改为下面的放成功

//修改后

 if ( type == "json" ) {
            ////////////以下为新增代码///////////////
            data = r.responseText;
            var start = data.indexOf(">");
            if(start != -1) {
              var end = data.indexOf("<", start + 1);
              if(end != -1) {
                data = data.substring(start + 1, end);
               }
            }
             ///////////以上为新增代码///////////////
             eval( "data = " + data);
       }

个人的上传多张图片代码

$.ajaxFileUpload({
type:'post',
 url:'addWebCommodityAction!addWebCommodity',// 服务器端程序
 secureuri:false,
 fileElementId:['doc1','doc2','doc3','doc4','doc5'],// input框的ID
 data :{comName:comName,comPrize:comPrize,comRepertory:comRepertory,comFreight:comFreight,comType:comType,merNo : merNo},
/* $("#upLoadForm").serialize() */
 dataType: 'json',// 返回数据类型
 beforeSend:function(){// 上传前需要处理的工作，如显示Loading...
 },
 success: function (data, status){// 上传成功
   if(data.msg == "001"){
     // 从data中获取数据，进行处理
    alert("添加商品成功！");
    $("#upLoadForm")[0].reset();
   } else{
     alert('添加商品失败！');
   }
 },
 error:function(data,status,e){
 alert("超时")
 }
});

具体可参考某大神的博客，地址为http://upvup.com/html/JQuery/2014-11-15/8.html