一、准备
1、插件下载地址：/kartik-v/bootstrap-fileinput/ 下载后的压缩包解压文件夹内容如下：
js：插件核心js代码，引用fileinput.min.js/fileinput.js即可，默认插件语言为英文，如需要中文需要引用js/locales/zh.js(其他语言引用相应的js文件)
js/plugins:相关辅助插件，piexif.min.js（resize image插件）、sortable.js（初始化预览窗口缩略图排序插件）、purify.js（看说明是净化html代码用的，试了下没有搞明白具体有说明作用）
css：插件核心css代码，fileinput.min.css/fileinput.css（核心css代码，引用任何一个）、fileinput-rtl.min.css/fileinput-rtl.css(选用这组css，文件选择框会和从右向左排列，即选择文件等相关按钮按钮在左边，文件框在右边)
themes:主题，如需要插件主题样式可引用主题文件夹下的相应js和css文件
查看示例：
打开压缩包中的example/index.html或者访问/file-basic-usage-demo查看示例。可根据示例的代码选择需要的控件代码使用。
2、代码引用
需要引用jquery
需要结合bootstrap使用，即页面需要引入bootstrap相关js和css文件
引用fileinput.js 和css
中文需要引用js/locales/zh.js
需要主题样式时引用themes下相关文件夹中的js和css
tips：最好以上按顺序引用，免得出现莫名其妙的问题，比如zh.js必须在fileinput.js后引用否则无效
二、使用示例
1、基本用法，自动将一个普通的input框渲染成高大上的文件上传选择框：
<input id="f_upload" type="file" class="file" />
只需要将class设置为file即可，效果如下：
2、隐藏文件预览窗口
<input id="input-1a" type="file" class="file" data-show-preview="false">
设置属性：data-show-preview=“false”，等同于初始化属性：showPreview：false
效果如下：
3、使用input 属性和data-**属性创建多样化的文件上传框
<input id="input-2" name="input2" type="file fileloading" class="file" multiple readonly="false" disabled="false" data-show-upload="false" data-show-caption="true" data-show-preview="true" data-allowed-file-extensions='["jpg","png"]'>
属性说明：
type="file fileloading" file表示此input框将被渲染为文件上传控件，fileloading在选择文件后产生预览前会有友好的转圈的loading提示（文件选择多了后比较容易观察到）
multiple：标识可以文件多选
readonly/disabled:这个不用解释了噻
data-show-upload：等同于属性showUpload，显示上传按钮，同理有data-show-remove、data-show-cancel等详见option
data-show-caption：显示文件上传的简介
data-allowed-file-extensions：允许的文件后缀名，另外有data-allowed-file-types详见option
.........
三、option选项说明：
7、Method说明：
8、常见问题与错误
8.1 引入所需文件后页面刷新查看样式奇怪，浏览器提示错误等，可能是因为js、css文件的引用顺序问题，zh.js需要在fileinput.js后面引入。bootstrap最好在fileinput前引入。
8.2 文件上传控件在使用$("form").serializeArray()时无法直接读取值，可以通过在文件上传完成后（fileuploaded）给一个隐藏的input框赋值的方式获取form值。
举例场景：
form表单中包含文件上传控件，需要在选择文件后不立刻上传，在点击form表单提交按钮后先上传文件，成功后提交表单。
