手动安装

 您也可以手动地安装插件到你的项目中。只要下载源ZIP或TAR球和提取资产(CSS和JS插件文件夹)到你的项目中。

使用

 步骤1:在你页面头部加载以下类库。

  1. <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet">
  2. <link href="path/to/css/fileinput.min.css" media="all" rel="stylesheet" type="text/css" />
  3. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  4. <script src="path/to/js/fileinput.min.js" type="text/javascript"></script>

   如果你注意到,你需要另外的fileinput.min.css和fileinput.min.js 还需加载 jquery.min.js和bootstrap.min.css。

  步骤2:初始化页面上的插件。比如说呢。

  1. // initialize with defaults
  2. $("#input-id").fileinput();
  3.  
  4. // with plugin options
  5. $("#input-id").fileinput({'showUpload':false, 'previewFileType':'any'});

    该#输入ID是输入的标识符(例如类型=文件)在您的网页,这是隐藏自动插件。

    或者,你可以直接调用插件的选项设置数据属性输入的字段。

  1. <input id="input-id" type="file" class="file" data-preview-file-type="text" >

Bootstrap File Input 中文文档的更多相关文章

  1. Bootstrap 中文文档教程

    Bootstrap 中文文档教程 Bootstrap 中文文档教程 全局样式和grid布局—Bootstrap中文使用指南 全局样式1.要求html5文档类型 Bootstrap使用的css属性和ht ...

  2. Spring中文文档

    前一段时间翻译了Jetty的一部分文档,感觉对阅读英文没有大的提高(*^-^*),毕竟Jetty的受众面还是比较小的,而且翻译过程中发现Jetty的文档写的不是很好,所以呢翻译的兴趣慢慢就不大了,只能 ...

  3. jQuery 3.1 API中文文档

    jQuery 3.1 API中文文档 一.核心 1.1 核心函数 jQuery([selector,[context]]) 接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素. jQ ...

  4. Weex中文文档

    这里整理当前已译出的Weex中文文档,如需查阅完整Weex文档,请访问http://alibaba.github.io/weex/doc/ . 同时也欢迎大家参与Weex中文文档翻译 [Guide] ...

  5. 【Chromium中文文档】线程

    线程 转载请注明出处:https://ahangchen.gitbooks.io/chromium_doc_zh/content/zh//General_Architecture/Threading. ...

  6. phantomjs 中文文档

    phantomjs 中文文档 转载 入门教程:转载 http://www.cnblogs.com/front-Thinking/p/4321720.html 1.介绍 简介   PhantomJS是一 ...

  7. Web3.js API 中文文档

    Web3.js API 中文文档 http://web3.tryblockchain.org/Web3.js-api-refrence.html web3对象提供了所有方法. 示例: //初始化过程 ...

  8. Apache Spark 2.2.0 中文文档

    Apache Spark 2.2.0 中文文档 - 快速入门 | ApacheCN Geekhoo 关注 2017.09.20 13:55* 字数 2062 阅读 13评论 0喜欢 1 快速入门 使用 ...

  9. Phoenix综述(史上最全Phoenix中文文档)

    个人主页:http://www.linbingdong.com 简书地址:http://www.jianshu.com/users/6cb45a00b49c/latest_articles 网上关于P ...

随机推荐

  1. Spring Cloud Consul 实现服务注册和发现

    Spring Cloud 是一个基于 Spring Boot 实现的云应用开发工具,它为基于 JVM 的云应用开发中涉及的配置管理.服务发现.断路器.智能路由.微代理.控制总线.全局锁.决策竞选.分布 ...

  2. java并发编程基础 --- 7章节 java中的13个原子操作类

    当程序更新一个变量时,如果多线程同时更新这个变量,可能得到期望之外的值,比如变量 i=1,A线程更新 i+1,B线程也更新 I+1,经过两个线程的操作之后可能 I不等于3,而是等于2.因为A和B线程更 ...

  3. Jquery精妙的自定义事件

    对于jQuery自定义事件,很多JavaScript开发者都会有所疑惑:在日常开发过程中会不会用到呢?而本文将结合一个开发案例,其中的一些地方应用到了jQuery的自定义事件,而且达到了很好的效果-精 ...

  4. 第五次作业-需求&原型改进

    需求&原型改进 0. 团队介绍 团队名称:121ComeOn 项目名称:个人博客项目 团队组成: PM:黄金筱(107) 成员:王枫(031),刘烨(255),周明浩(277) github地 ...

  5. 每日冲刺报告——Day4(Java-Team)

    第四天报告(11.5  周日) 团队:Java-Team 成员: 章辉宇(284) 吴政楠(286) 陈阳(PM:288) 韩华颂(142) 胡志权(143) github地址:https://git ...

  6. 201621123062《Java程序设计》第一周学习总结

    1.本周学习总结 关键词: 初步熟悉Java的基本组成.语言特点(简单性.结构中立性).运行环境.简单语法等. 关键概念之间的联系: 1.JVM是Java程序唯一认识的操作系统,其可执行文件为.cla ...

  7. Flask 蓝图(Blueprint)

    蓝图使用起来就像应用当中的子应用一样,可以有自己的模板,静态目录,有自己的视图函数和URL规则,蓝图之间互相不影响.但是它们又属于应用中,可以共享应用的配置.对于大型应用来说,我们可以通过添加蓝图来扩 ...

  8. Hibernate之缓存

    Hibernate为了解决频繁查询数据的效率问题,提供了三种级别的缓存 1.一级缓存 一级缓存 又叫 session缓存 .Session对象会缓存处于持久化状态的每个对象 ,如果下次想用数据表中同一 ...

  9. 在360、UC等浏览器,img不加载原因

    问题:图片在360浏览器不被加载,在UC浏览器强制不显示. 前言不多说,直接上图. 360浏览器显示情况: UC浏览器显示情况: 由以上两张截图可以看到,在360浏览器,banner图片处根本没有加载 ...

  10. Spring Cache扩展:注解失效时间+主动刷新缓存(二)

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...