bootstrap-select.js 下拉框多选后动态赋值
话不多说先上demo 其实demo是从官网下载的 只稍作改动 由于没有搞清楚怎么上传源代码 就把官网的链接贴出来吧 https://github.com/silviomoreto/bootstrap-select/archive/master.zip
其中改动的部分
<form class="form-horizontal" role="form">
<div class="form-group">
<label for="maxOption2" class="col-lg-2 control-label">multiple, show-menu-arrow, maxOptions=2</label> <div class="col-lg-10">
<select id="maxOption2" class="selectpicker show-menu-arrow form-control" multiple >
<option value="chicken">chicken</option>
<option value="turkey">turkey</option>
<option value="duck">duck</option>
<option value="goose">goose</option>
</select>
</div>
</div>
</form>
<script>
document.addEventListener('DOMContentLoaded', function () {
var mySelect = $('#first-disabled2'); $('#special').on('click', function () {
mySelect.find('option:selected').prop('disabled', true);
mySelect.selectpicker('refresh');
}); $('#special2').on('click', function () {
mySelect.find('option:disabled').prop('disabled', false);
mySelect.selectpicker('refresh');
}); $('#basic2').selectpicker({
liveSearch: true,
maxOptions: 1
});
$("#maxOption2").selectpicker('val',['chicken','turkey','duck']);
}); </script>
其中,$("#maxOption2").selectpicker('val',['chicken','turkey','duck']);为设置多选值!
注意事项:1.此代码需写在页面的加载完成之后触发。
2.在实际用的时候jquery版本用最新的就可以了。我用的3.0
3.实际用的时候如果是动态赋值需要 $("#maxOption2").selectpicker('refresh');刷新。
bootstrap-select.js 下拉框多选后动态赋值的更多相关文章
- Vue.js中使用select选择下拉框
在Vue.js中使用select选择下拉框有两种方法: 第一种: Add.html: <select v-model="sysNotice.noticeType" id=&q ...
- jquery实现下拉框多选
一.说明 本文是利用EasyUI实现下拉框多选功能,在ComboxTree其原有的基础上对样式进行了改进,样式表已上传demo,代码如下 二.代码 <!DOCTYPE html PUBLIC & ...
- vue实现下拉框全选和输入匹配
实际项目中的一个需求: 点击文本框,弹出带有复选框的选项,然后获取选中项的数据,传给后面的一个功能.在文本框输入内容,也会动态的匹配下拉列表,并且列表带有全选功能. 朴素的效果图: 我选择了用vue实 ...
- select change下拉框改变事件 设置选定项,禁用select
select change下拉框改变事件 设置选定项,禁用select 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio ...
- js下拉框二级关联菜单效果代码具体实现
这篇文章介绍了js下拉框二级关联菜单效果代码具体实现,有需要的朋友可以参考一下 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transit ...
- jq select change下拉框选项变化判断选中值,添加(attr)或移除(removeAttr)一个或多个属性
select change下拉框选项变化判断选中值,添加(attr)或移除(removeAttr)一个或多个属性 $("#IsRecommend").change(function ...
- js下拉框
Js下拉框 http://sc.chinaz.com/tag_jiaoben/XiaLaKuang.html
- combobox中动态加入几个checkbox,实现下拉框多选
combobox中动态加入几个checkbox,实现下拉框多选,将一个checkbox选中时其内容就会在combobox中显示出来,将另一个checkbox选中时其内容会跟在第一个checkbox的内 ...
- Excel怎么下拉框多选
打开Exlce, 确定,然后 右击查看代码,把这段代码复制到新建的文件里面 此时Excel会给出提示,选择否,,系统会提示保存,在保存的时候选择启用宏的工作簿然后保存,此时Excel下拉框多选就搞定了 ...
随机推荐
- WebLogic11g-创建域(Domain)及基本配置
转:http://www.codeweblog.com/weblogic11g-%e5%88%9b%e5%bb%ba%e5%9f%9f-domain-%e5%8f%8a%e5%9f%ba%e6%9c% ...
- 重温CLR(十五) 托管堆和垃圾回收
本章要讨论托管应用程序如何构造新对象,托管堆如何控制这些对象的生存期,以及如何回收这些对象的内存.简单地说,本章要解释clr中的垃圾回收期是如何工作的,还要解释相关的性能问题.另外,本章讨论了如何设计 ...
- 网站使用QQ登录问题小结
关于网站如何使用QQ登陆这个问题就不多说了,很简单,登陆connect.qq.com找到相应的SDK,下载下来,里面会有demo,将相应的appid,appkey和回调地址callback改成自己的就 ...
- python read txt file
refer to: http://www.jianshu.com/p/d8168034917c http://www.liaoxuefeng.com/wiki/001374738125095c955c ...
- How to install cacti on centos 6
Cacti – Network and performance monitoring tool Cacti is one of best monitoring tool used to monit ...
- tar 打包处理文件
基本格式:tar [Options] file_archive //注意tar的第一参数必须为命令选项,即不能直接接待处理文件 Option是由三部分组成,分别是操作类型(创建,查看,解压),压缩处理 ...
- Python nltk English Detection
http://blog.alejandronolla.com/2013/05/15/detecting-text-language-with-python-and-nltk/ >>> ...
- Unit05: 实战技巧 、 资费列表 、 拦截器
Unit05: 过滤器解决表单写中文乱码.拦截器 1. 使用过滤器解决表单中文参数值乱码问题 注意: a. 表单提交方式必须为POST. b. 过滤器的编码应该与浏览器端设置的编码一致. 2. 拦截器 ...
- java代码---indexOf()方法
总结:indexOf(String str,int index)方法.从参数指定位置开始,如果index值超过了字符串长度,则返回-1 package com.a.b; import java.io. ...
- Vim编辑器基本操作学习(二)
操作符+位移 x命令可以删除一个字符,4x可以删除4个字符. dw可以删除一个word,w事实上是向后移动一个word的命令:dw可以接上一个任意一个位移命令,它将删除从当前光标开始到位移终点处的文本 ...