失眠网 > jquery+php+ajax显示上传进度的多图片上传并生成缩略图代码【PHP】

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

时间：2021-01-21 20:14:14

后端开发|php教程

jquery,php,ajax,图片,上传,生成,缩略图

后端开发-php教程

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

源码中国怎么样,ubuntu调用登录界面,最简单爬虫实例,php appkey,网络seo文章lzw

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

黑色时尚橱柜网站源码,ubuntu软件双击响应,python实现爬虫出错,& new php,苹果seo方案lzw

效果图如下：

个性网址导航源码 ,ubuntu之后用什么,安装tomcat服务器失败,爬虫系统上线,哪些大平台是用PHP,奉节seo优化lzw

实现代码如下：

JavaScript代码如下：

$(document).ready(function() {

$("#filelist").niceScroll({

cursorwidth: "8px",

cursorborderradius: "0px",

cursoropacitymin: 0.1,

cursoropacitymax: 0.3

});

$(".side-pane").niceScroll({

cursorwidth: "8px",

cursorborderradius: "0px",

cursoropacitymin: 0.1,

cursoropacitymax: 0.3

});

$(".time").timeago();

});

javascript代码如下：

// <![CDATA[ $(#upload_button).click(function() {

$(.side-pane).html(\);

$(#upload_button).hide();

$(#pickfiles).hide();

$(#upload_info).show();

$(#upload_info).css("display","inherit");

uploader.start(); $(#filelist).block({

message:

Upload in Progress

css: {

border: one,

backgroundColor: one

overlayCSS: {

backgroundColor: #fff,

opacity: ,

cursor: wait

}

});

}); var uploader = new plupload.Uploader({

runtimes : flash, html5,

browse_button : pickfiles,

container : uploader,

max_file_size : 10mb,

url : upload.php,

flash_swf_url : uploader/uploader.swf,

filters : [

{ title : "Image files", extensions : "jpg,jpeg,gif,png" }

]

}); uploader.bind(Init, function(up, params) {});

uploader.init(); uploader.bind(FilesAdded, function(up, files) {

@@ Show / hide various elements

$(.upload-message).hide();

$(.info-message).hide();

$(#upload_button).show();

$(#filelist_header).show(); $.each(files, function(i, file) {

$(#filelist).append(

+file.name +

+ plupload.formatSize(file.size) +

);$(#remove_+file.id).click(function(e) {

uploader.removeFile(file)

$(#+file.id).hide(slow, function() { (#+file.id).remove(); });

});

}); up.refresh();

$(#filelist).animate({scrollTop: $(#filelist).attr("scrollHeight")}, 1500);

}); uploader.bind(UploadProgress, function(up, file) {

$(#status_ + file.id).html(file.percent + "%");

if(file.percent == 100) {

$(# + file.id).block({

message: \,

css: {

border: one,

backgroundColor: one

overlayCSS: {

backgroundColor: #fff,

opacity: .7,

cursor: wait

}

});

}

$(#percent).width(uploader.total.percent+"%");

$(#upRate).text(Math.ceil(uploader.total.bytesPerSec/1024)+" kb/sec");

}); uploader.bind(FileUploaded, function(up, file, response) {

var input = $("#uploaded_photos");

var data = response.response;

var details = data.split(,);

if(details[0] == success) {

var photo_html =

+details[1]+

;

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(

All photos have been uploaded.

);

}

});

}); // ]]>

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

XML/HTML代码如下：

Name

Size

Status

Select files to upload

Upload

upload.php页面代码如下：

<?php

@@ Including the functions.php for using the necessary functions.

include(functions.php);

@@ This is the file upload class which does all the uploading work.

include(class.upload.php);

if(isset($_FILES["file"])) {

@@ Generating unique name for the photo.

$time = time();

$rand_1 = rand(999, 999999);

$rand_2 = rand(999999, 999999999);

$rand_3 = rand();

$unique_value = $time.\_.$rand_1.\_.$rand_2.\_.$rand_3;

@@ Folder creation for each and every day. This ensures performance even with millions of images.

$folder = date(zY);

if(substr($folder, 0) == 0) {

$folder = 367.date(Y);

}

@@ This folder is for the source image files.

$pfolder = ../upload/source/;

if(!is_dir($pfolder)) {

mkdir($pfolder, 0755);

}

@@ This folder is for the image files with 120x120 dimensions.

$tfolder = ../upload/small/;

if(!is_dir($tfolder)) {

mkdir($tfolder, 0755);

}

@@ Assigning the upload file to the upload class for all the processing.

$handle = new Upload($_FILES["file"]);

if($handle->uploaded) {

$extension = $handle->file_src_name_ext;

$mime = $handle->file_src_mime;

if(($mime == image.gif alt="jquery+php+ajax显示上传进度的多图片上传并生成缩略图代码【PHP】" title="jquery+php+ajax显示上传进度的多图片上传并生成缩略图代码【PHP】") || ($mime == image/jpg) || ($mime == image/png) || ($mime == image/bmp) || ($mime == image/pjpeg) | ($mime == image/jpeg)) {

@@ Check if the uploaded filetype is an image or not.

if(($extension == gif) || ($extension == jpg) || ($extension == jpeg) || ($extension == png) || ($extension == mp) || ($extension == pjpeg)) {

if($handle->image_src_x > 500) {

@@ Check if the filesize is smaller than 10 MB. 10 MB = 10485760 bytes.

if($handle->file_src_size < 10485760) {

@@ Getting the actual file name (with and without extension) and sanitizing it for inserting in the database.

$real_name = clean_input($handle->file_src_name);

$body_name = clean_input($handle->file_src_name_body);

$handle->file_new_name_body = $unique_value.\_.$body_name;

$handle->Process($pfolder);

$handle->image_resize = true;

$handle->image_ratio_crop = T;