jquery fileupload控件的用法
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
jquery fileupload控件的用法
`jQuery File Upload`是一个基于`jQuery`的文件上传插件，用于实现文件的异步上传功能。
其用法如下：
1. 需要加载的`js`文件：`jquey-1.8.3.min.js`、`jquery-ui-widget.js`、`jquery.iframe-transport.js`、`jquery.fileupload.js`。
2. `html`代码：
```html
<input id="fileupload" type="file" name="files()" data-url="server/php/" multiple>
```
3. `js`代码：
```javascript
$(function () {
$("#fileupload").fileupload({
dataType: 'json',
done: function (e, data) {
$.each(data.result.files, function (index, file) {
$("<p/>").text().appendTo(document.body);
})
},
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$("#progress .bar").css("width", progress + "%");
},
// 需要一个<div>容器用来显示进度
<div id="progress">
<div class="bar" style="width: 0%;">
</div>
});
})
```
4. `API`：
- `Initialization`：在上传按钮上调用`fileupload()`方法。
示例：`$(' #fileupload' ).fileupload();`。
- `Options`：
- `url`：请求发送的目标`url`。
类型：`string`。
示例：`/path/to/upload/handler.json`。
- `type`：文件上传`HTTP`请求方式，可以选择`“POST”`、`“PUT”`或者`“PATCH”`，默认`“POST”`。
类型：`string`。
示例：`'PUT'`。
- `dataType`：希望从服务器返回的数据类型，默认`“json”`。
类型：`string`。
示例：`'json'`。
- `autoUpload`：默认情况下，只要用户点击了开始按钮被添加至组件的文件会立即上传。
将`autoUpload`值设为`true`可以自动上传。
类型：`boolean`。
默认：`true`。
- `acceptFileTypes`：允许上传的文件类型。
示例：`/(\.|\/)(gif|jpe?g|png|xlsx)$/i`。
- `maxFileSize`：最大上传文件大小。
示例：`999000`（999KB）。
单位：`B`。
- `minFileSize`：最小上传文件大小。
示例：`100000`（100KB）。
单位：`B`。
此外，`jQuery File Upload`还提供了显示上传进度条、验证和预览图像、音频、视频的功能，适用于任何服务器端平台（`PHP`、`Python`、`Ruby on Rails`、`Java`、`Node.js`、`Go`等），支持标准的`HTML`表单文件上传。