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下拉框多选就搞定了 ...
随机推荐
- VScode插件
Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语法高亮.智能代码补全.自定义热键.括号匹配.代码片段. ...
- lapis 路由
1. 路由以及url 模式 参考如下: local lapis = require("lapis") local app = lapis.Application() app:mat ...
- keycloak 了解
Keycloak 是一个针对Web应用和 RESTful Web 服务提供 SSO 集成.基于 OAuth 2.0 和 JSON Web Token(JWT) 规范.目前用于实现 JBoss 与 Wi ...
- 部署coredns
1 前提: 1.1不依赖kubeadm的方式,适用于不是使用kubeadm创建的k8s集群,或者kubeadm初始化集群之后,删除了dns相关部署. 1.2 DNS IP :10 ...
- Oracle 之 AIO (异步io)
Linux 异步 I/O (AIO)是 Linux 内核中提供的一个增强的功能.它是Linux 2.6 版本内核的一个标准特性,AIO 背后的基本思想是允许进程发起很多 I/O 操作,而不用阻塞或等 ...
- hadoop之 Hadoop2.2.0中HDFS的高可用性实现原理
在Hadoop2.0.0之前,NameNode(NN)在HDFS集群中存在单点故障(single point of failure),每一个集群中存在一个NameNode,如果NN所在的机器出现了故障 ...
- 【备忘】mysql主从设置
主(master)192.168.1.10机器设置: [root@vm-vagrant mysql]# vi my.cnf [mysqld]节点下添加以下配置server-id=1log-bin=my ...
- 默认库“library”与其他库的使用冲突;使用 /NODEFAULTLIB:library
您试图与不兼容的库链接. 重要事项 运行时库现在包含防止混合不同类型的指令.如果试图在同一个程序中使用不同类型的运行时库或使用调试和非调试版本的运行时库,则将收到此警告.例如,如果编译一个文件以使用一 ...
- 使用Apache POI操作Excel文件---在已有的Excel文件中插入一行新的数据
package org.test; import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundEx ...
- 浅谈浅克隆(shallow clone)和 深克隆(deep clone)
区别就在于是否对对象中的引用变量所指向的对象进行拷贝. 1.浅克隆/浅复制/浅拷贝 浅拷贝是指在拷贝对象时,对于基本数据类型的变量会重新复制一份,而对于引用类型的变量只是对引用进行拷贝,没有对引用指向 ...