PHP + Ajax + JS: multimap upload and multiple ajax Images
In this example, an ajax multi-Image Upload task is required for the wap site project, which is combined with the js plug-in for your reference. The specific content is as follows:
/* Upload an image through ajax */var num = 0; // click "delete image function onDelete (num) {if ($ (" # "+ num ). attr ('src ')! = "_ PUBLIC _/Home/images/jiazai.gif" & $ ("#" + num). attr ('src ')! = "") {If (confirm ("are you sure you want to delete") {$ ("# a" + num ). remove () ;}else {// }}$ (function () {$ ("# file0 "). bind ("change", function () {clickUpload (num) ;}); function clickUpload (num) {var imgObject = document. getElementById ('file0'); // file object $ ("# yulan "). append ("<a id = 'a" + num + "'onclick = 'ondelete (" + num + ") 'href = 'javascript :; '> </a> "); // $ ("# Yulan "). append ("<li id = 'a" + num + "'> <a href = 'javascript :; 'onclick = 'ondelete ("+ num +") '> Delete </a> </li> "); var getImageSrc = getFullPath (imgObject ); // local path // instantiate the image object var pos = getImageSrc. lastIndexOf (". "); var lastname = getImageSrc. substring (pos, getImageSrc. length) // image suffix if (lastname! = ". Jpg" & lastname! = ". Png" & lastname! = ". Jpeg" & lastname! Images '.gif ') {$ ("# a" + num ). remove (); alert ("select an image");} else {ajaxFileUpload (num); $ ("# file0 "). unbind ("change "). bind ("change", function () {clickUpload (num) ;});} num ++;} function getFullPath (obj) {// obtain the complete image path 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 (o Bj. files) {return obj. files. item (0 ). getAsDataURL ();} return obj. value;} return obj. value ;}} function ajaxFileUpload (num) {$. ajaxFileUpload ({url: 'http: // xxxx/updateImg ', // secureuri: false, // whether the security protocol is required, generally set to false fileElementId: 'file0', // The ID dataType of the file upload field: 'json', // the return value type is generally set to json success: function (data) // The server responds to the processing function {var jsonText = data; console. log (jsonText); if (json Text ['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 ("Image Upload Failed") ;}}, error: function (data, e) // server response failure handler {alert (e );}})}});
The above is all the content of this article. I hope it will help you learn php programming.