官方教程

http://www.kuitao8.com/demo/20140224/1/bootstrap-multiselect-master/index.html

使用方法:

第一步引用样式以及相关JS

<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css"/>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script> <!-- Include the plugin's CSS and JS: -->
<script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
<link rel="stylesheet" href="css/bootstrap-multiselect.css" type="text/css"/>

第二步 构造Selection(注意 需要设置multiple属性,否则依然是单选模式,multiple="multiple" )

<!-- Build your select: -->
<select class="multiselect" multiple="multiple">
<option value="cheese">Cheese</option>
<option value="tomatoes">Tomatoes</option>
<option value="mozarella">Mozzarella</option>
<option value="mushrooms">Mushrooms</option>
<option value="pepperoni">Pepperoni</option>
<option value="onions">Onions</option>
</select>

第三步 初始化插件:

<script type="text/javascript">
$(document).ready(function() {
$('.multiselect').multiselect();
});
</script>

常用方法:

  1. select

    $('#cid').multiselect('select', arr[i]); 给控件设置选中项

  2. 获取值

$('#cid').val();获取控件所有的选中值

bootstrap-multiselect 多选的更多相关文章

  1. web 前端常用组件【03】Bootstrap Multiselect

    实际的项目网站中或多或少的或用到多选框,我选用的一款是 Bootstrap Multiselect. 官方文档:http://www.kuitao8.com/demo/20140224/1/boots ...

  2. Jquery ajax 绑定multiselect多选下拉选项,同时异步执行返回值

    Jquery ajax 绑定multiselect多选下拉选项,同时异步执行获取返回值 function load(mslt_employees,belongto,mark) {//传入$(#ID) ...

  3. bootstrap multiselect的使用 多选下拉菜单

    官网网址: http://davidstutz.de/bootstrap-multiselect/

  4. JS组件系列——两种bootstrap multiselect组件大比拼

    前言:今天继续来看看bootstrap的另一个组件:multiselect.记得在项目开始之前,博主项目组几个同事就使用哪些js组件展开过讨论,其中就说到了select组件,由于项目的整体风格使用的b ...

  5. bootstrap multiselect两大组件

    组件说明以及API 1.第一个组件——multiple-select.这个组件风格简单.文档全.功能强大.但是觉得它选中的效果不太好.关于它的效果展示,我们放在后面. 2.第二个组件——bootstr ...

  6. Bootstrap Multiselect插件使用步骤以及常见参数配置介绍

    Multiselect是基于jQuery插件的,它可以以下拉列表的形式为用户提供选择内容,能进行单选或者多选.它应用的主要步骤如下: 一,引入需要的相关js和css文件 既然是Bootstrap插件, ...

  7. jquery.multiselect 多选下拉框实现

    第一步:链接下列文件,如果没有,到此网页下载 https://github.com/ehynds/jquery-ui-multiselect-widget,此插件基于jquery ,所以jquery的 ...

  8. js:jquery multiSelect 多选下拉框实例

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

  9. Bootstrap Multiselect

    Getting Started Link the Required Files First, the jQuery library needs to be included. Then Twitter ...

  10. bootstrap table 复选框选中后,翻页不影响已选中的复选框

    使用的 jquery版本为 2.1.1 在项目中发现bootstrap table的复选框选中后,翻页操作会导致上一页选中的丢失,api中的 bootstrapTable('getSelections ...

随机推荐

  1. Linux下强制杀死进程的方法

    常规篇: 首先,用ps查看进程,方法如下: $ ps -ef …… smx 1822 1 0 11:38 ? 00:00:49 gnome-terminal smx 1823 1822 0 11:38 ...

  2. hdu3001Travelling

    参考了别人的代码   https://blog.csdn.net/u010372095/article/details/38474721 深感自己的弱小 这是tsp问题,和基本的tsp问题没什么大的区 ...

  3. springboot源码解读

    springboot源码从main函数开始 public static void main(String[] args) { ApplicationContext app = SpringApplic ...

  4. System.InvalidOperationException: 可为空的对象必须具有一个值。

    Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware[0]      An unhandled exception has ...

  5. mysql之CREATE DATABASE Syntax(创建数据库)

    一:语法 CREATE {DATABASE | SCHEMA} [IF NOT EXISTS] db_name #SCHEMA是DATABASE的同义词 [IF NOT EXITTS]可防止建库是已经 ...

  6. python 打印堆栈信息方法

    第一种方法使用logging模块 import logging def test(self): try: 1 / 0 # 触发异常 except BaseException as e: logging ...

  7. hdu 6127---Hard challenge(思维)

    题目链接 Problem Description There are n points on the plane, and the ith points has a value vali, and i ...

  8. eclipse引入php源包

    首先安装这些yum install gcc gcc-c++ kernel-devel autoconf automake libtool bison re2c gdb 导入时,如果有这个报错的话 Pr ...

  9. JAVA发送http get/post请求,调用http接口、方法

    import java.io.BufferedReader; import java.io.IOException;import java.io.InputStream; import java.io ...

  10. Excel设置excel打印每页都有表头标题

    Excel设置excel打印每页都有表头标题