以下将需要3分钟左右的阅读时间。
第一步阅读说明简介。了解到:目前是4.4版支持Bootstrap3.x及4.0版。5.x版本是重写的一个最新版本。该插件去预览上传多种格式的文件。支持Ajax。以下以4.4版说明。
第二步安装(引用)。引用CSS、JS(注意顺序)
CSS:bootstrap.min.css,fileinput.min.css
JS:
jquery-3.3.1.min.js,(必需)
piexif.min.js(可选,可以在上传前改变图片),
sortable.min.js(可选,如果要排序文件的话),
popper.min.js(可选,用于放大和预览文件),
bootstrap.min.js,(必需)
fileinput.min.js,(主文件)
theme.js,(主题包,字体)
(lang).js(本地化,中文引入zh.js)
第三步使用。
<input id="ID" type="file" class="file" data-preview-file-type="text" >
$("#ID").fileinput();//默认功能,$("#input-id") 。Jquery对象,HTML代码中的id为ID
NPM
NPM的全称是 node package manager. 是一个NodeJS包管理分发工具。node.js 就是服务端 javascript.
bower
a package manger for the web. Bower是一个客户端技术的软件包管理器,它可用于搜索、安装和卸载如JavaScript、HTML、CSS之类的网络资源.
jsDelivr
jsDelivr 是一个免费开源的 CDN 解决方案,用于帮助开发者和站长。包含 JavaScript 库、jQuery 插件、CSS 框架、字体等等 Web 上常用的静态资源