<!DOCTYPE html>

 <html>

 <head>

   <title>Bootstrap3级联多选下拉框</title>

   <meta charset="utf-8">

   <link rel="stylesheet" href="F:/webClient/bootstrap-3.3.7-dist/css/bootstrap.min.css">

   <link rel="stylesheet" href="./bootstrap-select.css">

   <style>

     body {

       padding-top: 70px;

     }

   </style>

 </head>

 <body>

     <nav class="navbar navbar-default navbar-fixed-top" role="navigation">

       <div class="container">

         <div class="navbar-header">

           <a class="navbar-brand" href="#">Bootstrap-select usability tests</a>

         </div>

       </div>

     </nav>

     <div class="container">

         <select id="first-disabled" class="selectpicker" multiple data-hide-disabled="true" data-live-search="true">

             <optgroup disabled="disabled" label="disabled">

               <option>Hidden</option>

             </optgroup>

             <optgroup label="Fruit">

               <option>Apple</option>

               <option>Orange</option>

             </optgroup>

             <optgroup label="Vegetable">

               <option>Corn</option>

               <option>Carrot</option>

             </optgroup>

          </select>

     </div>

 <script src="F:/webClient/AngularJS/scripts/jquery-1.9.1/jquery.min.js"></script>

 <script src="F:/webClient/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>

 <script src="./bootstrap-select.js"></script>

 </body>

 </html>

Bootstrap3级联多选下拉框的更多相关文章

  1. Easyui-Combobox多选下拉框

    因为工作需要,引入combobox多选下拉框,并且获取选择的值并以","分开. 效果如下: 代码如下: <html> <head> <title> ...

  2. Extjs4.2 多选下拉框

    //多选下拉框 Ext.define('MDM.view.custom.MultiComboBox', { extend: 'Ext.form.ComboBox', alias: 'widget.mu ...

  3. js：jquery multiSelect 多选下拉框实例

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. DropDownList单选与多选下拉框

    一.单选DropDownList传值 1.添加界面的DropDownList显示值问题 (1)在方法内添加ViewData的方法: var ad = new UnitsRepository(); Vi ...

  5. pentaho cde 自定义复选下拉框 checkbox select

    pentaho  自带的component 虽多,但是当用户需要在一个表格中查看多个组别的数据时,pentaho自带的单选框就不能实现了,所以复选下拉框势在必行,实现效果如下: 实现原理是借用了jqu ...

  6. js怎么能取得多选下拉框选中的多个值？

    方法:获取多选下拉框对象数组→循环判断option选项的selected属性(true为选中,false为未选中)→使用value属性取出选中项的值.实例演示如下: 1.HTML结构 1 2 3 4 ...

  7. js多选下拉框

    1.js原生实现 1.1:引用JS文件 /*! jQuery v1.12.4 | (c) jQuery Foundation | jquery.org/license */ !function(a,b ...

  8. query多选下拉框插件 jquery-multiselect(修改)

    其实网上关于该控件的使用教程已经很多了,其中 query多选下拉框插件 jquery-multiselect Jquery多选下拉列表插件jquery multiselect功能介绍及使用 这2个的介 ...

  9. 多选下拉框带搜索（aps.net）

    自己写了一个带搜索功能的多选下拉框,为了要获取值,就没有封装插件,实现思路 1.一个文本框 做搜索 2.一个文本框显示选中文本,一个隐藏控件存值 3.一个div里面绑定CheckBoxList控件(这 ...

随机推荐

  1. Xamarin.Android 使用AsyncTask提示上传动态

    我们有时候会通过WebServices上传数据,如果信息量过大并没有提示,用户会觉得是死机,或是系统崩溃,这时候我们可以用到AsyncTask(异步任务)来提示上传信息,例如:正在上传数据... 这里 ...

  2. Python（1）

    Python 学习 Part1 1. 斐波那契数序列 >>> a,b=0,1 >>> a 0 >>> b 1 >>> while ...

  3. linux学习（JDK，Tomcat，nginx）安装

    最近学习了在linux,在上面搭建了一个tomcat的服务器,后来又使用nginx进行反向代理了一下下,希望文章对初学者有所帮助. 1.安装JDK.(采用jdk的rpm包进行安装) 安装jdk之前需要 ...

  4. selenium webdriver (python)的基本用法一

    阅在线 AIP 文档:http://selenium.googlecode.com/git/docs/api/py/index.html目录一.selenium+python 环境搭建........ ...

  5. poi的合并单元格和冻结行列

    //创建工作薄(excel) Workbook wb = new HSSFWorkbook(); //创建sheet Sheet createSheet = wb.createSheet(" ...

  6. SSM-Spring-19：Spring中JdbcTemplate

    ------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- Spring自带一个ORM持久化框架JdbcTemplate,他可以说是jdbc的加强版,但是对最细微的控制肯 ...

  7. AndroidEclipse里的视图里想添加SDK Manager但是找不到怎么办？

    有时候,我们想配置SDK Manager,但是发现找不到这个窗口,怎么办呢,网上有解释(上截图): —————————————————————————————————————————————————— ...

  8. .NET Orm 性能测试

    .NET Orm 性能测试 简介 OrmBenchmark 这个项目主要是为了测试主要的Orm对于 SqlServer 数据库的查询并将数据转换成所需 POCO 对象的耗时情况(好吧,实际上不完全or ...

  9. TCP的延迟ACK机制

    TCP的延迟ACK机制 TCP的延迟ACK机制一说到TCP,人们就喜欢开始扯三步握手之类的,那只是其中的一个环节而已.实际上每一个数据包的正确发送都是一个类似握手的过程,可以简单的把它视为两步握手.一 ...

  10. Java 读书笔记 (八) 修饰符

    Java语言提供了很多修饰符,主要分为以下两类: 访问修饰符 非访问修饰符 访问控制修饰符 default (即缺省,什么也不写): 在同一包内可见,不使用任何修饰符.使用对象.类.接口.变量.方法. ...