zyUpload批量上传php_四种不同的zyupload PHP上传实例教程源码

使用教程：

此插件包含三个版本，分别是：基础功能版、拖拽功能版、裁剪功能版

三个版本实例分别对应：demo.basic.html、demo.drag.html、demo.tailor.html

带有全部功能的实例对应：demo.html -- 此页面是所有版本实例的入口

引入相关JS、CSS

初始化、参数配置$(function(){// 初始化插件$("#zyupload").zyUpload({

width            :   "650px",                 // 宽度height           :   "400px",                 // 宽度itemWidth        :   "140px",                 // 文件项的宽度itemHeight       :   "115px",                 // 文件项的高度url              :   "./up.php",              // 上传文件的路径fileType         :   ["jpg","png","txt","js"],// 上传文件的类型fileSize         :   51200000,                // 上传文件的大小multiple         :   true,                    // 是否可以多个文件上传dragDrop         :   true,                    // 是否可以拖动上传文件tailor           :   true,                    // 是否可以裁剪图片del              :   true,                    // 是否可以删除文件finishDel        :   false,    // 是否在上传文件完成后删除预览/* 外部获得的回调接口 */onSelect: function(selectFiles, allFiles){    // 选择文件的回调方法  selectFile:当前选中的文件  allFiles:还没上传的全部文件console.info("当前选择了以下文件：");console.info(selectFiles);

},

onDelete: function(file, files){              // 删除一个文件的回调方法 file:当前删除的文件  files:删除之后的文件console.info("当前删除了此文件：");console.info(file.name);

},

onSuccess: function(file, response){          // 文件上传成功的回调方法console.info("此文件上传成功：");console.info(file.name);console.info("此文件上传到服务器地址：");console.info(response);

$("#uploadInf").append("上传成功，文件地址是：" + response + "");

},

onFailure: function(file, response){          // 文件上传失败的回调方法console.info("此文件上传失败：");console.info(file.name);

},

onComplete: function(response){             // 上传完成的回调方法console.info("文件上传完成");console.info(response);

}

});

});

HTML结构

div>