Plupload有以下功能和特点：
1、拥有多种上传方式：flash、HTML5、silverlight以及传统的<input type=”file” />。Plupload会自动侦测当前的环境，选择最合适的上传方式，并且会优先使用HTML5的方式。所以你完全不用去操心当前的浏览器支持哪些上传方式，Plupload会自动为你选择最合适的方式。
2、支持以拖拽的方式来选取要上传的文件
3、支持在前端压缩图片，即在图片文件还未上传之前就对它进行压缩
4、可以直接读取原生的文件数据，这样的好处就是例如可以在图片文件还未上传之前就能把它显示在页面上预览
5、支持把大文件切割成小片进行上传，因为有些浏览器对很大的文件比如几G的一些文件无法上传。
Plupload的使用方法可以分为以下几步：
1、引入JS文件，plupload的源文件可以到github上去下载
2、实例化一个plupload对象，传入一个配置参数对象进行各方面的配置。
3、调用plupload实例对象的init()方法进行初始化
4、在plupload实例对象上注册各种你需要的事件。plupload从选取文件到文件上传完成这个过程中，会触发很多事件。我们可以通过这些事件来跟plupload进行交互。
5、实现你自己所注册的那些事件的监听函数，利用这些监听函数来进行更新UI、提示上传进度等工作。
1 jsp中部分代码如下：（涉及到plupload的代码）
<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>plupload上传</title>
</head>
<style>
.progress {
position: relative;
margin-top: 30px;
background: #eee;
}
.bar {
background-color: green;
display: block;
width: 0%;
height: 15px;
}
.percent {
position: absolute;
height: 15px;
top: -18px;
text-align: center;
display: inline-block;
left: 0px;
width: 80px;
color: #666;
line-height: 15px;
font-size: 12px;
}
.upload-li {
text-indent: 4px;
height: 30px;
line-height: 30px;
}
</style>
<body>
<!-- 上传弹出框 -->
<div id="uploadDialog" class="upload-dialog">
<ul id="file-video-list">
</ul>
<footer class="add-footer">
<button id="add-btn" class = "small-button">添加</button>
<button id="add-upload" class = "small-button">上传</button>
</footer>
</div>
</body>
<script type="text/javascript" src="${ctx}/statics/js/plugins/plupload/plupload.full.min.js"></script>
</html>
2 javascrip代码中部分代码（涉及到plupload的代码）
//======================================= 文件上传 begin ie9 以下对隐藏的 uploader不能很好的渲染 ===================================
var uploader = new plupload.Uploader({
browse_button : "add-btn",
//runtimes : 'html5,flash,html4',
url : ctxPath + "/upload/ftpFileUpload",
// flash_swf_url,silverlight_xap_url路径要写全，否则会在IE下出现问题（无法打开选择文件窗口）
flash_swf_url : ctxPath+'/statics/js/plugins/plupload/Moxie.swf',
silverlight_xap_url :ctxPath+ '/statics/js/plugins/plupload/Moxie.xap',
filters : {
mime_types : [ // 只允许上传图片文件
{
title : "视频文件",
extensions : "AVI,MP4,H264,exe,zip,txt,doc"
} ]
}
});
// 绑定文件添加进队列事件
uploader.bind('FilesAdded', function(uploader, files) {
for (var i = 0, len = files.length; i < len; i++) {
// 文件名
var file_name = files[i].name;
// 构造html
var html = '<div id="file-' + files[i].id + '"><li class="upload-li" >视频名称：'+files[i].name+'</li>'
+'<li class="upload-li" >视频备注：<input id="remark-' + files[i].id + '" class="input-30030" type="text" title = "备注"></li>'
+'<li class="progress"><span class="bar"></span><span class="percent">上传中 0%</span></li></div>';
$(html).appendTo('#file-video-list');
}
});
uploader.bind('UploadProgress', function(uploader,file) {
var percent = file.percent;
$("#file-" + file.id).find('.bar').css("width" , percent+"%");
if(percent==100){
$("#file-" + file.id).find(".percent").html("上传成功");
}else{
$("#file-" + file.id).find(".percent").html("上传中 " + percent + "%");
}
});
uploader.bind('FileUploaded', function(uploader, files, responseObject) {
if (responseObject.status == 200) {
data = $.parseJSON(responseObject.response);
if (data.code == 0) {
}else{
$("#file-" + files.id).find(".percent").html("上传失败");
layer.msg(data.msg, {icon : 5,time : 1000});
}
}
});
// 上传前触发
uploader.bind('BeforeUpload',function(uploader, file){
// 自定义传入参数
uploader.setOption("multipart_params",{"remark":$("#remark-" + file.id).val()});
});
uploader.bind('UploadComplete', function(uploader, files) {
$('#add-upload').attr("disabled",false);
if (files.length == 0) {
layer.alert("请选择文件", {icon : 7});
return;
}
layer.msg("文件上传成功！", {icon : 1,time : 1000});
files.splice(0,files.length);
});
uploader.init();
$('#add-upload').on('click', function() {
//绑定文件上传的自定义变量
$('#add-upload').attr("disabled",true);
uploader.start();
});
//=======================================文件上传 end===================================
========================分割线==========================
在IE下使用plupload时需要注意：（这是我在用的时候犯得错）
1 flash_swf_url、silverlight_xap_url 路径要写对不要写成js/silverlight_xap_url 这样写会在IE下出现问题。
2 如果上传是在弹出窗中需要先show出来窗口然后再初始化uploader。
IE下不能很好的渲染display：none属性的节点。
3 批量上传时实际上是多次请求了后台，如果想自定义传入参数可在上传前事件中写。
// 上传前触发
uploader.bind('BeforeUpload',function(uploader, file){
// 自定义传入参数
uploader.setOption("multipart_params",{"remark":$("#remark-" + file.id).val()});
});