Home > php教程 > php手册 > body text

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

WBOY
Release: 2016-06-06 20:18:18
Original
1464 people have browsed it

这篇文章主要介绍了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代码如下:

复制代码 代码如下:

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!