%20(2).svg)
项目简介
easyUpload.js 是一款简单易用、高度可配置的H5/Web文件上传插件。它支持多文件上传、批量上传、混合上传以及多实例上传，提供了丰富的配置选项，包括文件类型、大小限制、上传进度显示等，适用于各种文件上传场景。
项目的主要特性和功能
- 文件类型可配置，允许用户选择上传的文件类型，如图片、文档等。
- 文件数量可配置，限制用户一次可以上传的文件数量。
- 文件大小可配置，限制上传文件的大小。
- 上传前文件可预览，在上传前用户可以预览选择的文件。
- 实时上传进度条，显示文件上传的实时进度。
- 支持批量上传，可同时上传多个文件。
- 支持不同类型文件混合上传，用户能同时上传不同类型的文件。
- 请求数据格式可配置，支持配置base64或FormData等数据格式。
- 请求头可配置，允许自由配置请求头，如内容类型等。
- 请求成功状态码可配置，可以配置判断请求成功的状态码。
安装使用步骤
1. 引入easyUpload.min.js和easy_upload.min.css
在HTML页面中引入以下两个文件： ```html
```
2. 配置插件
使用easyUpload函数并传入相应的配置参数，如action（上传地址）、accept（允许的文件类型）等。
javascript
easyUpload({
easyId: 'easy1',
action: 'https://jsonplaceholder.typicode.com/posts/',
accept: '.jpg,.png,.gif,.pdf,.docx',
maxSize: 3, //单位MB
showLoading: true,
setRequestHeader: function(xhr) {
xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
},
buildSendData: function(file) {
return file.base64; //发送格式为base64时
},
checkSuccessCode: function(xhr) {
if (/error/.test(xhr.responseText.toLowerCase())) {
return false;
} else {
return true;
}
},
uploadStart: function(self) {
console.log('上传开始，现在的队列是', self.files);
},
uploadEnd: function(self) {
console.log('上传完成了，现在的队列是', self.files);
}
});
3. 定制样式
插件的CSS和结构是分离的，可根据自己的需求自由定制样式。
参数说明
插件接受一个配置对象作为参数，该对象包含多种配置项，如文件类型、大小、数量限制，上传成功或失败的回调等。具体配置项请参考项目中的defaultConfigs对象。
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】