Plupload使用API
Plupload有以下功能和特点：
1、拥有多种上传方式：HTML5、flash、silverlight以及传统的<input type=”file” />。Plupload会自动侦测当前的环境，选择最合适的上传方式，并且会优先使用HTML5的方式。所以你完全不用去操心当前的浏览器支持哪些上传方式，Plupload会自动为你选择最合适的方式。
2、支持以拖拽的方式来选取要上传的文件
3、支持在前端压缩图片，即在图片文件还未上传之前就对它进行压缩
4、可以直接读取原生的文件数据，这样的好处就是例如可以在图片文件还未上传之前就能把它显示在页面上预览
5、支持把大文件切割成小片进行上传，因为有些浏览器对很大的文件比如几G的一些文件无法上传。
Plupload的使用方法也与SWFUpload非常类似，可以分为以下几步：
1、引入js文件
2、实例化一个plupload对象，传入一个配置参数对象进行各方面的配置。
3、调用plupload实例对象的init()方法进行初始化
4、在plupload实例对象上注册各种你需要的事件。plupload从选取文件到文件上传完成这个过程中，会触发很多事件。我们可以通过这些事件来跟plupload进行交互。
5、实现你自己所注册的那些事件的监听函数，利用这些监听函数来进行更新UI、提示上传进度等工作。
大家可以到看一下我写的关于plupload的几个上传demo。
下面用一段代码来说明Plupload的使用方法。
首先看下我的目录结构
index.html的代码如下：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Plupload使用指南</title> <!-- 首先需要引入plupload的源代码 --> <script src="http://www.mamicode.com/js/plupload.full.min.js"></script> </head> <body> <!-- 这里我们只使用最基本的html结构：一个选择文件的按钮，一个开始上传文件的按钮(甚至该按钮也可以不要) --> <p> <button>选择文件</button> <button>开始上传</button> </p> <script> //实例化一个plupload上传对象 var uploader = new plupload.Uploader({ browse_button : ‘browse‘, //触发文件选择对话框的按钮，为那个元素id url : ‘upload.php‘, //服务器端的上传页面地址 flash_swf_url : ‘js/Moxie.swf‘, //swf文件，当需要使用swf方式进行上传时需要配置该参数 silverlight_xap_url : ‘js/Moxie.xap‘ //silverlight文件，当需要使用silverlight方式进行上传时需要配置该参数 }); //在实例对象上调用init()方法进行初始化 uploader.init(); //绑定各种事件，并在事件监听函数中做你想做的事 uploader.bind(‘FilesAdded‘,function(uploader,files){ //每个事件监听函数都会传入一些很有用的参数， //我们可以利用这些参数提供的信息来做比如更新UI，提示上传进度等操作 }); uploader.bind(‘UploadProgress‘,function(uploader,file){ //每个事件监听函数都会传入一些很有用的参数， //我们可以利用这些参数提供的信息来做比如更新UI，提示上传进度等操作 }); //...... //...... //最后给"开始上传"按钮注册事件 document.getElementById(‘start_upload‘).onclick = function(){ uploader.start(); //调用实例对象的start()方法开始上传文件，当然你也可以在其他地方调用该方法 } </script> </body> </html>
使用Plupload的关键是了解它众多的配置参数、事件以及属性和方法。我把它官网上的文档翻译成了中文并整理如下。我也把它放到了github上，你可以到去查阅。
目录：
一、配置参数
实例化一个plupload对象时，也就是 new plupload.Uploader()，需要传入一个对象作为配置参数。后面内容中出现的plupload实例均是指new plupload.Uploader()得到的实例对象
属性类型默认值描述browse_button String / DOM 触发文件选择对话框的DOM元素，当点击该元素后便后弹出文件选择对话框。该值可以是DOM元素对象本身，也可以是该DOM元素的id
url String 服务器端接收和处理上传文件的脚本地址，可以是相对路径(相对于当前调用Plupload的文档)，也可以是绝对路径
filters Object { } 可以使用该参数来限制上传文件的类型，大小等，该参数以对象的形式传入，它包括三个属性：
温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/71017.html
