<!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. Flask构建微电影（二）

    第三章.项目分析.搭建目录及模型设计 3.1.前后台项目目录分析 微电影网站 前台模块 后台模块 前台(home) 数据模型:models.py 表单处理:home/forms.py 模板目录:tem ...

  2. String的split（）方法可以将字符串按照特定的分隔符拆分成字符串数组

    在java.lang包中有String.split()方法,返回是一个数组------不管按照什么拆,拆出来是一个数组 String str = "1,2,3,4,5,6"; St ...

  3. linux中~/cut/argus/

    1.Linux shell 截取字符变量的前8位 实现方法有如下几种: expr substr "$a" 1 8 echo $a|awk '{print substr(,1,8)} ...

  4. wireshark使用方法

    抓取报文: 下载和安装好Wireshark之后,启动Wireshark并且在接口列表中选择接口名,然后开始在此接口上抓包.例如,如果想要在无线网络上抓取流量,点击无线接口.点击Capture Opti ...

  5. Linux网络简介

    Linux的网络简介 1.TCP/IP协议簇  (通俗的解释就是为了网路传输指定的一种标准),它将网络划分为四层:应用层 .传输层.互联层 .网络接口层 . 基础层是网络接口层(说白了就是把帧格式的数 ...

  6. 微信小程序开发之formId使用（模板消息）

    基于微信小程序的模板消息:基于微信的通知渠道,我们为开发者提供了可以高效触达用户的模板消息能力,以便实现服务的闭环并提供更佳的体验.模板推送位置:服务通知模板下发条件:用户本人在微信体系内与页面有交互 ...

  7. aliyun oss操作汇总

    // endpoint以杭州为例,其它region请按实际情况填写 String endpoint = "http://oss-cn-hangzhou.aliyuncs.com"; ...

  8. Eureka源码分析：Eureka不会进行二次Replication的原因

    Eureka不会进行二次同步注册信息 Eureka会将本实例中的注册信息同步到它的peer节点上,这是我们都知道的特性.然而,当peer节点收到同步数据后,并不会将这些信息再同步到它自己的peer节点 ...

  9. python二维码生成器

    周小董简书主页二维码.png   周小董博客主页二维码.png 现在,我们生活中到处可以看到二维码.它有啥好处呢?它具有信息容量大.可靠性高.可表示汉字及图象多种文字信息.保密防伪性强等优点. 我们生 ...

  10. 新浪微博注册（elenium Python 自动化）

    from selenium import webdriverfrom selenium.webdriver.common.keys import Keysfrom time import sleep ...