本文实例在wap站项目中需要做一个ajax多图片上传,结合js插件做了一个,供大家参考,具体内容如下
/* ajax 上传图片 */ var num = 0; // 点击删除图片 function onDelete(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); }); function clickUpload(num){ var imgObject = document.getElementById(\'file0\'); // 文件对象 $(\"#yulan\").append(\"<a id=\'a\"+num+\"\' onclick=\'onDelete(\"+num+\")\' href=\'javascript:;\'> <img id=\'\"+num+\"\' width=\'75\' height=\'75\' src=\'__PUBLIC__/Home/images/jiazai.gif\'/></a>\"); // $(\"#yulan\").append(\"<li id=\'a\"+num+\"\' ><img id=\'\"+num+\"\' src=\'__PUBLIC__/Home/images/jiazai.gif\' /><a href=\'javascript:;\' onclick=\'onDelete(\"+num+\")\'>删除</a></li>\"); var getImageSrc = getFullPath(imgObject); // 本地路径 // 实例化image对象 var pos = getImageSrc.lastIndexOf(\".\"); var lastname = 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++; } function getFullPath(obj) { //得到图片的完整路径 if (obj) { if (window.navigator.userAgent.indexOf(\"MSIE\") >= 1) { obj.select(); return document.selection.createRange().text; }else if (window.navigator.userAgent.indexOf(\"Firefox\") >= 1) { if (obj.files) { return obj.files.item(0).getAsDataURL(); } return obj.value; } return obj.value; } } function ajaxFileUpload(num) { $.ajaxFileUpload ( { url: \'http://xxxx/updateImg\', //用于文件上传的服务器端请求地址 secureuri: false, //是否需要安全协议,一般设置为false fileElementId: \'file0\', //文件上传域的ID dataType: \'json\', //返回值类型 一般设置为json success: function (data) //服务器成功响应处理函数 { var jsonText = data; console.log(jsonText); if(jsonText[\'status\']==1){ if(jsonText[\'info\']!=\"\"){ console.log(jsonText[\'info\']); $(\"#\"+num).attr(\"src\",\"__PUBLIC__//Admin/Upload/\"+jsonText[\'info\']); var images = $(\"#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程序设计有所帮助。
本文地址:https://www.stayed.cn/item/22647
转载请注明出处。
本站部分内容来源于网络,如侵犯到您的权益,请 联系我