PHP+Ajax+JS实现多图上传
本文实例在wap站项目中需要做一个ajax多图片上传,结合js插件做了一个,供大家参考,具体内容如下
/*ajax上传图片*/ varnum=0; //点击删除图片 functiononDelete(num){ if($("#"+num).attr('src')!="__PUBLIC__/Home/images/jiazai.gif"&&$("#"+num).attr('src')!=""){ if(confirm("确认删除吗")){ $("#a"+num).remove(); }else{ // } } } $(function(){ $("#file0").bind("change",function(){ clickUpload(num); }); functionclickUpload(num){ varimgObject=document.getElementById('file0');//文件对象 $("#yulan").append("<aid='a"+num+"'onclick='onDelete("+num+")'href='javascript:;'><imgid='"+num+"'width='75'height='75'src='__PUBLIC__/Home/images/jiazai.gif'/></a>"); //$("#yulan").append("<liid='a"+num+"'><imgid='"+num+"'src='__PUBLIC__/Home/images/jiazai.gif'/><ahref='javascript:;'onclick='onDelete("+num+")'>删除</a></li>"); vargetImageSrc=getFullPath(imgObject);//本地路径 //实例化image对象 varpos=getImageSrc.lastIndexOf("."); varlastname=getImageSrc.substring(pos,getImageSrc.length)//图片后缀 if(lastname!=".jpg"&&lastname!=".png"&&lastname!=".jpeg"&&lastname!='.gif'){ $("#a"+num).remove(); alert("请选择一张图片"); }else{ ajaxFileUpload(num); $("#file0").unbind("change").bind("change",function(){ clickUpload(num); }); } num++; } functiongetFullPath(obj){//得到图片的完整路径 if(obj){ if(window.navigator.userAgent.indexOf("MSIE")>=1){ obj.select(); returndocument.selection.createRange().text; }elseif(window.navigator.userAgent.indexOf("Firefox")>=1){ if(obj.files){ returnobj.files.item(0).getAsDataURL(); } returnobj.value; } returnobj.value; } } functionajaxFileUpload(num){ $.ajaxFileUpload ( { url:'http://xxxx/updateImg',//用于文件上传的服务器端请求地址 secureuri:false,//是否需要安全协议,一般设置为false fileElementId:'file0',//文件上传域的ID dataType:'json',//返回值类型一般设置为json success:function(data)//服务器成功响应处理函数 { varjsonText=data; console.log(jsonText); if(jsonText['status']==1){ if(jsonText['info']!=""){ console.log(jsonText['info']); $("#"+num).attr("src","__PUBLIC__//Admin/Upload/"+jsonText['info']); varimages=$("#img").val(); if(images!=""){ $("#img").val(images+","+jsonText['info']); }else{ $("#img").val(images+""+jsonText['info']); } } }else{ $("#a"+num).remove(); //alert("图片上传失败"); } }, error:function(data,e)//服务器响应失败处理函数 { alert(e); } } ) } });
以上就是本文的全部内容,希望对大家学习php程序设计有所帮助。