bootstrap-multiselect 多选
官方教程
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>
常用方法:
- select
$('#cid').multiselect('select', arr[i]); 给控件设置选中项
- 获取值
$('#cid').val();获取控件所有的选中值
bootstrap-multiselect 多选的更多相关文章
- web 前端常用组件【03】Bootstrap Multiselect
实际的项目网站中或多或少的或用到多选框,我选用的一款是 Bootstrap Multiselect. 官方文档:http://www.kuitao8.com/demo/20140224/1/boots ...
- Jquery ajax 绑定multiselect多选下拉选项,同时异步执行返回值
Jquery ajax 绑定multiselect多选下拉选项,同时异步执行获取返回值 function load(mslt_employees,belongto,mark) {//传入$(#ID) ...
- bootstrap multiselect的使用 多选下拉菜单
官网网址: http://davidstutz.de/bootstrap-multiselect/
- JS组件系列——两种bootstrap multiselect组件大比拼
前言:今天继续来看看bootstrap的另一个组件:multiselect.记得在项目开始之前,博主项目组几个同事就使用哪些js组件展开过讨论,其中就说到了select组件,由于项目的整体风格使用的b ...
- bootstrap multiselect两大组件
组件说明以及API 1.第一个组件——multiple-select.这个组件风格简单.文档全.功能强大.但是觉得它选中的效果不太好.关于它的效果展示,我们放在后面. 2.第二个组件——bootstr ...
- Bootstrap Multiselect插件使用步骤以及常见参数配置介绍
Multiselect是基于jQuery插件的,它可以以下拉列表的形式为用户提供选择内容,能进行单选或者多选.它应用的主要步骤如下: 一,引入需要的相关js和css文件 既然是Bootstrap插件, ...
- jquery.multiselect 多选下拉框实现
第一步:链接下列文件,如果没有,到此网页下载 https://github.com/ehynds/jquery-ui-multiselect-widget,此插件基于jquery ,所以jquery的 ...
- js:jquery multiSelect 多选下拉框实例
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Bootstrap Multiselect
Getting Started Link the Required Files First, the jQuery library needs to be included. Then Twitter ...
- bootstrap table 复选框选中后,翻页不影响已选中的复选框
使用的 jquery版本为 2.1.1 在项目中发现bootstrap table的复选框选中后,翻页操作会导致上一页选中的丢失,api中的 bootstrapTable('getSelections ...
随机推荐
- SQL SERVER 小语法
1. 取字段长度:len select * from 表名 where len(expmessage)=1 2.rtrim, ltrim rtrim(ObjectName)
- VsCode编写和调试.NET Core
本文转自:https://www.cnblogs.com/Leo_wl/p/6732242.html 阅读目录 使用VsCode编写和调试.NET Core项目 回到目录 使用VsCode编写和调试. ...
- FileInputStream与FileOutputStreawm实现文件的加密与解密
- python3调用zabbix api
前言 今天写了一个zabbix api,这里整理一下,过程中自己也学习了一些东西. 需求 我们需要查一个文件内容如下: cat /ops/flume_hosts node1 node2 需要把这个文件 ...
- workman的学习总结
我们知道php主要是用来做web应用的,而且平时使用的都是都是和其他的web服务器来结合使用,比如和apache,nginx和apache的时候,是作为apache的一个动态模块来加载,和nginx的 ...
- 微信小程序scroll-view 横向和纵向scroll-view组件
scroll-view为滚动视图,分为水平滚动和垂直滚动.注意滚动视图垂直滚动时一定要设置高度否则的话scroll-view不会生效.滚动视图常用的地方一般都是Item项比较多的界面,比如我的模块 主 ...
- Android之ListView,AsyncTask,GridView,CardView,本地数据存储,SQLite数据库
版权声明:未经博主允许不得转载 补充 补充上一节,使用ListView是用来显示列表项的,使用ListView需要两个xml文件,一个是列表布局,一个是单个列表项的布局.如我们要在要显示系统所有app ...
- 《你不知道的javascript》读书笔记2
概述 放假读完了<你不知道的javascript>上篇,学到了很多东西,记录下来,供以后开发时参考,相信对其他人也有用. 这篇笔记是这本书的下半部分,上半部分请见<你不知道的java ...
- Java学习笔记30(集合框架四:List接口)
List接口继承自Collection接口 具有重要的三大特点: 1.有序集合:存入和取出的顺序一致 2.此接口的用户可以对列表中每个元素插入位置精确的控制:可以通过索引操作 3.可以存储重复元素 L ...
- day 75vue 脚手架学习 脚手架的使用
前情提要: vue 自定化开发工具 (vue-cli的使用) 一:安装脚手架,以及准备 1: 下载地址, https://nodejs.org/en/download/ 2:如果下载成功,在cmd ...