jquery+php+ajax显示上传进度的多图片上传并生成缩略图代码

这篇文章主要介绍了jquery+php+ajax显示上传进度的多图片上传并生成缩略图代码,可实现带有进度条效果的多图上传功能与生成缩略图功能,是web开发中非常实用的技巧

本例用到其他2个php class.upload.php和 functions.php还有css和js以及img文件

完整实例代码点击此处本站下载。

效果图如下：

实现代码如下：

JavaScript代码如下：

复制代码 代码如下:

 

javascript代码如下：

复制代码 代码如下:

';
                        input.val(input.val() + details[1] + ":");
                    } else {
                        var photo_html = '

'+details[1]+'

';
                    }
                $('.side-pane').prepend(photo_html);
                $('.time').timeago();
            });
 
            uploader.bind('UploadComplete', function(up, files) {
                $('#upload_info').hide();
                $('#filelist').unblock({
                    onUnblock: function () {
                        $('#filelist_header').hide();
                        $('#filelist').html('

ok
All photos have been uploaded.

');
                    }
                });
            });
 
        // ]]> 
       

上面2个js都放在index.php里面

XML/HTML代码如下：

复制代码 代码如下: