基于bootstrap的文件上傳控件bootstrap fileinput
更新時間：2016年12月23日 08:46:18 作者：程序猿hu
這篇文章主要為大家詳細(xì)介紹了基于bootstrap的文件上傳控件bootstrap fileinput，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文實例為大家分享了文件上傳控件bootstrap fileinput的使用方法，供大家參考，具體內(nèi)容如下
github地址：https://github.com/kartik-v/bootstrap-fileinput
官網(wǎng)：http://plugins.krajee.com/file-input
1.下載壓縮文件.
2.導(dǎo)入文件
bootstrap-fileinput/css/fileinput.min.css
bootstrap-fileinput/js/fileinput.min.js
如果需要考慮中文化，那么還需要引入文件：
bootstrap-fileinput/js/fileinput_locale_zh.js
<link type="text/css"rel="stylesheet"href="${ctx}/components/fileinput/css/fileinput.css" />
<script type="text/javascript" src="${ctx}/components/fileinput/js/fileinput.js"></script>
<script type="text/javascript" src="${ctx}/components/fileinput/js/fileinput_locale_zh.js"></script>
<body>
<input type="file" name="image" class="projectfile" value="image.png"/>
<!--
1. type=file和class=projectfile，指明其為input file類型。
2. name指定其在后臺的獲取key。
3. value指定其在展示的時候圖片路徑。
-->
</body>
<script>
control.fileinput({
language: 'zh', //設(shè)置語言
uploadUrl: uploadUrl, //上傳的地址
allowedFileExtensions : ['jpg', 'png','gif'],//接收的文件后綴
showUpload: false, //是否顯示上傳按鈕
showCaption: false,//是否顯示標(biāo)題
browseClass: "btn btn-primary", //按鈕樣式
previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
});
</script>
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
js在指定位置增加節(jié)點函數(shù)insertBefore()用法實例
這篇文章主要介紹了js在指定位置增加節(jié)點函數(shù)insertBefore()用法,實例分析了insertBefore()函數(shù)追加結(jié)點的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-01-01
這篇文章主要介紹了原生js頁面滾動延遲加載圖片的相關(guān)資料,現(xiàn)在瀑布流效果大行其道，各種網(wǎng)站都有應(yīng)用，尤其是專業(yè)的圖片類型的網(wǎng)站，感興趣的朋友可以參考下2015-12-12
JavaScript 早已不只是一門寫寫網(wǎng)頁特效的腳本語言了，如今廣泛用于網(wǎng)站的前端交互。2011-04-04
這篇文章主要給大家介紹了如何用JS實現(xiàn)簡單的屏幕錄像機(jī),文中通過代碼示例給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下2023-12-12
利用微信強(qiáng)大的社交能力通過小程序達(dá)到裂變的目的，拉取新用戶。下面小編給大家?guī)砹宋⑿判〕绦蛏珊蠓窒砼笥讶Φ膶崿F(xiàn)方法，感興趣的朋友跟隨小編一起看看吧2019-05-05
實現(xiàn)在?Chrome?中執(zhí)行?JavaScript?代碼
這篇文章主要介紹了實現(xiàn)在?Chrome?中執(zhí)行?JavaScript?代碼，下面來介紹如何在?Chrome?中打開開發(fā)者工具，以及如何在開發(fā)者工具中運行調(diào)試?JavaScript?代碼，具有一的的參考價值,需要的朋友可以參考一下2022-03-03
這篇文章主要介紹了JS手寫一個自定義Promise操作,結(jié)合實例形式分析了JS自定義Promise的實現(xiàn)與使用相關(guān)操作技巧,需要的朋友可以參考下2020-03-03
下面小編就為大家?guī)硪黄猠s6 字符串String的擴(kuò)展(實例講解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-08
什么是閉包呢？閉包就是函數(shù)實例執(zhí)行過程中動態(tài)產(chǎn)生一個沒有被釋放資源的棧區(qū)，也是一個預(yù)執(zhí)行的過程。2011-01-01
這篇文章主要介紹了js中l(wèi)et和var定義變量的區(qū)別,非常不錯，具有參考借鑒價值,需要的朋友可以參考下2018-02-02