bootstrap multiselect 多选功能实现方法

更新时间：2017年06月05日 10:54:58 作者：LittleFeiHu

这篇文章主要介绍了bootstrap multiselect 多选功能实现方法,需要的朋友可以参考下

官方教程

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

使用方法：

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

<link rel="stylesheet" href="css/bootstrap.min.css" rel="external nofollow" 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" rel="external nofollow" 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 多选功能实现方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！

您可能感兴趣的文章:

EditPlus注册码生成器(js代码实现)
在线的EditPlus注册码生成器，看了看还真是，在这里exe的注册机病毒太多，纯js的在线注册机可就放心了，感兴趣的各位可以参考下哈，希望可以帮助到你
2013-03-03
JavaScript中的高级函数
在JavaScript中，函数的功能十分强大，除了函数相关的基础知识外，掌握一些高级函数并应用起来，不仅能让JS代码看起来更为精简，还可以提升性能，本文是小编总结的一些常用的、重要的函数
2018-01-01
js继承实现方法详解
这篇文章主要介绍了js继承实现方法,结合实例形式分析了javascript继承的实现方法与相关注意事项,需要的朋友可以参考下
2016-12-12
简单谈谈offsetleft、offsetTop和offsetParent
这篇文章主要给大家介绍了offsetleft、offsetTop和offsetParent的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-12-12
javascript if 的简化代码
a=0 if(a<1)alert(a),alert(1-a) VS if(a==0){alert(a);alert(1-a)}
2008-02-02
JavaScript实现函数缓存及应用场景
在JavaScript中,可以通过函数缓存来提高函数的执行效率,本文就来介绍一下JavaScript实现函数缓存及应用场景,具有一定的参考价值,感兴趣的可以了解一下
2024-01-01
JavaScript实现扯网动画效果的示例代码
这篇文章主要为大家详细介绍了如何利用JavaScript语言实现扯网动画效果，文中的示例代码讲解详细，对我们学习JS有一定的帮助，需要的可以参考一下
2022-06-06
webpack该如何打包(打包流程)
这篇文章主要介绍了webpack该如何打包及打包流程,本文通过图文示例相结合给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧
2023-12-12
最短的IE判断var ie=!-[1,]分析
下面通过分解这个语句来回顾下代码中所涉及到的javascript知识,需要的朋友可以参考下
2014-05-05
JavaScript验证18位身份证号码最后一位正确性的实现代码
这篇文章主要介绍了JavaScript验证18位身份证号码最后一位正确性的实现代码,小编亲测有效,需要的朋友可以参考下
2014-08-08