PHP + jQuery + Ajax multi-Image Upload

Provides various official and user-released code examples. For code reference, you are welcome to exchange and learn. Today we will introduce a multi-Image Upload plug-in: plupload, which achieves multi-Image Upload through PHP + Ajax. You only need to click to select the image to be uploaded, and then the image is automatically uploaded to the server and immediately displayed on the page.
If you want to see Detailed tutorialHttp://www.sucaihuo.com/js/3.html, and DEMOAnd can be downloaded for free. Var uploader = new plupload. Uploader ({// constructor for creating an instance
Runtimes: 'html5, flash, silverlight, html4 ',
// Select the priority order for the upload plug-in Initialization Method
Browse_button: 'btn ',
// Upload button
Url: "ajax. php ",
// Remote upload address
Flash_swf_url: 'plupload/Moxie.swf ',
// Flash file address
Silverlight_xap_url: 'plupload/Moxie. xap ',
// Silverlight file address
Filters :{
Max_file_size: '500kb ',
// Maximum size of the uploaded file (in the format of 100b, 10kb, 10 mb, 1 gb)
Mime_types: [// File Upload type allowed
{
Title: "files ",
Extensions: "jpg, png, gif"
}]
},
Multi_selection: true,
// True: ctrl Multifile upload; false: Single File Upload
Init :{
FilesAdded: function (up, files) {// before File Upload
If ($ ("# ul_pics"). children ("li"). length> 30 ){
Alert ("You have uploaded too many images! ");
Uploader. destroy ();
} Else {
Var li = '';
Plupload. each (files,
Function (file) {// traverses a file
Li + ="

0%

";
});
$ ("# Ul_pics"). append (li );
Uploader. start ();
}
},
UploadProgress: function (up, file) {// upload in progress, display progress bar
$ ("#" + File.id).find('.bar').css ({
"Width": file. percent + "%"
}). Find (". percent"). text (file. percent + "% ");
},
FileUploaded: function (up, file, info) {// triggered when the file is uploaded successfully
Var data = JSON. parse (info. response );
$ ("#" + File.id).html ("

"+ Data. name +"

");
},
Error: function (up, err) {// triggered when an upload Error occurs
Alert (err. message );
}
}
});
Uploader. init ();More special jQuery effects: http://www.sucaihuo.com/js. You can enjoy it. New users can learn ^_^.

Php?jquery=ajaxmultiimage upload. Zip (423.47 KB download: 364 times)

AD: truly free, domain name + VM + enterprise mailbox = 0 RMB