插件描述：jQuery.filer是一款简单的HTML5文件上传组件美化jQuery插件。它能够完成单文件和多文件的上传，支持文件的拖拽，支持不同的文件格式校验，支持缩略图和图标等，是一款非常实用的文件上传插件
jQuery.filer
jQuery.filer是一款简单的HTML5文件上传组件美化jQuery插件。它能够完成单文件和多文件的上传，支持文件的拖拽，支持不同的文件格式校验，支持缩略图和图标等，是一款非常实用的文件上传插件。
它有以下特点：对文件上传File Input组件进行美化
支持多文件上传
支持校验文件：大小，扩展名等
支持创建文件的缩略图
每种类型的文件可以自定义图标
可以为缩略图，图标和input自定义模板和主题
可以移出已选择的文件
可以从剪切板粘贴图片
所有的图标在一个字体文件中
支持文件拖拽
安装
可以通过bower来安装该文件上传插件。$bowerinstalljquery.filer
使用方法
使用该文件上传插件需要在页面头部引入jQuery.filer的样式文件。
引入jQuery和jquery.filer.min.js文件。
HTML结构
最简单的文件上传HTML结构如下：
初始化插件
在页面DOM元素加载完毕之后，可以通过下面的方法来初始化该文件上传插件。$(document).ready(function(){
$('#filer_input').filer();
});
配置参数limit：最大上传文件的数量，类型：Number，默认值为:null。
maxSize：上传文件的最大尺寸，单位MB。类型：Number，默认值为:null。
extensions：可上传的文件的文件扩展名。类型：Array，默认值为:null。
changeInput：创建一个新的文件上传input元素。你可以使用默认的模板或自己编写自己的模板。类型：Boolean, String, Function, Object，默认值为:true。
showThumbs：显示文件预览。类型：Boolean，默认值为: false。
appendTo：目标缩略图的目标元素选择器。当需要在指定的元素上添加文件预览时使用该选项。类型：String，默认值为:null。
theme：指定jQuery.filer的主题。类型：String，默认值为:null。
templates：指定文件预览的模板，选择器和一些参数。{
box:null,//Thumbnail'sboxelement{null,String}
item:null,//Fileitemelement{String(useFilerVariables),Function}
itemAppend:null,//Fileitemelementforeditmode{String(useFilerVariables),Function}
progressBar:null,//Fileuploadprogressbarelement{String}
itemAppendToEnd:false,//Appendthenewfileitemtotheendofthelist{Boolean}
removeConfirmation:true,//Removefileconfirmation{Boolean}
_selectors:{
list:null,//Listselector{String}
item:null,//Itemselector{String}
progressBar:null,//Progressbarselector{String}
remove:null//Removebuttonselector{String}
}
}
uploadFile：启用即时文件上传功能。在这个对象中，你可以指定普通jQuery的$.ajax参数或回调函数。{
url:null,//URLtowhichtherequestissent{String}
data:null,//Datatobesenttotheserver{Object}
type:'POST',//Thetypeofrequest{String}
enctype:'multipart/form-data',//Requestenctype{String}
beforeSend:null,//Apre-requestcallbackfunction{Function}
success:null,//Afunctiontobecallediftherequestsucceeds{Function}
error:null,//Afunctiontobecallediftherequestfails{Function}
statusCode:null,//AnobjectofnumericHTTPcodes{Object}
onProgress:null,//Afunctioncalledwhileuploadingfilewithprogresspercentage{Function}
onComplete:null//Afunctioncalledwhenallfileswereuploaded{Function}
}
dragDrop：允许文件拖拽功能。在该对象中可以指定回调函数。{
dragEnter:null,//Afunctionthatisfiredwhenadraggedelemententerstheinput.{Function}
dragLeave:null,//Afunctionthatisfiredwhenadraggedelementleavestheinput.{Function}
drop:null,//Afunctionthatisfiredwhenadraggedelementisdroppedonavaliddroptarget.{Function}
}
addMore：允许选择多个文件。类型：Boolean，默认值为: false。
clipBoardPaste：允许粘贴拷贝图片。类型：Boolean，默认值为: false。
excludeName：在移除文件的时候，插件会创建一个隐藏域，name属性将使用该参数。默认值为: jfiler-items-exclude-(input file name)-(input index)。
files：已经上传的文件。[
{
name:"appended_file.jpg",
size:5453,
type:"image/jpg",
file:"/path/to/file.jpg"
},
{
name:"appended_file_2.jpg",
size:9453,
type:"image/jpg",
file:"path/to/file2.jpg"
}
]beforeRender：在渲染jQuery.filer input之前触发。
afterRender：在渲染jQuery.filer input之后触发。
beforeShow：在显示缩略图之前触发。
afterShow：在显示缩略图之后触发。
beforeSelect：在选择一个文件之后，并在将该文件添加到input之前触发。该函数返回一个布尔值。
onSelect：在选择一个文件之后触发。
onRemove：在移除一个文件之后触发。
onEmpty：在没有文件被选择的时候触发。
options：在对象中定义自己的参数，定义之后可以在任何地方使用。
captions：指定自己的标题。{
button:"ChooseFiles",
feedback:"ChoosefilesToUpload",
feedback2:"fileswerechosen",
drop:"DropfileheretoUpload",
removeConfirmation:"Areyousureyouwanttoremovethisfile?",
errors:{
filesLimit:"Only{{fi-limit}}filesareallowedtobeuploaded.",
filesType:"OnlyImagesareallowedtobeuploaded.",
filesSize:"{{fi-name}}istoolarge!Pleaseuploadfileupto{{fi-maxSize}}MB.",
filesSizeAll:"Filesyou'vechoosedaretoolarge!Pleaseuploadfilesupto{{fi-maxSize}}MB."
}
}
