Layui 下拉select多选实现

1. html

<div id="mo_deptment"></div>

2.引用

<script src="~/layuiadmin/layui/xm-select.js"></script>
3.设置全局变量存储控件

var mo_deptmentSelect;

4.layui.use 中初始化

4.1 列表数据

var mo_deptmentdata = [

{name: '综合室', value: '综合室'},//, selected: true

{name: '质控信息室', value: '质控信息室'},

{name: '实验分析室', value: '实验分析室'},

{name: '监测应急室', value: '监测应急室'},

{name: '放射源安全室', value: '放射源安全室'},

];

4.2 初始选择数据

var mo_deptment="综合室,质控信息室";

var sv = mo_deptment.split(',');

4.3 初始化

var mo_deptmentSelect = xmSelect.render({

el: '#mo_deptment',

language: 'zn',

initValue: sv,

data: mo_deptmentdata

});

5.获取选中数据

var selectArr = mo_deptmentSelect.getValue();

var sv = "";

$.each(selectArr,function(i,v){

if(i==selectArr.length-1) sv += v.name;

else sv += v.name+",";

});

6.清除选中数据 和设置选中数据

mo_deptmentSelect.setValue(\[\]);

相关推荐
wordbaby3 分钟前
为什么 Apifox 能调通,浏览器却报跨域?一次“CORS Error + 403”联调排坑实录
前端
2603_9658966210 分钟前
JavaScript 原型与原型链
开发语言·前端·javascript
Amos_Web10 分钟前
通过 Rspack 源码学 Rust(四):用 `Option<T>` 表达“查询可能没有结果”
前端
朋友圈自动点赞工具16 分钟前
Ruby方法查找:对象不存方法
开发语言·前端·ruby·科技资讯
晓得迷路了20 分钟前
栗子前端技术周刊第 152 期 - Rspack 2.3、TypeScript 7.1 Beta、Bun 1.4.4...
前端·javascript·css
普通人631 分钟前
CSS-box-sizing-使用指南
开发语言·前端·css·1024程序员节
风骏时光牛马36 分钟前
AI开源工具一站式尝鲜体验
前端
IT_陈寒1 小时前
Python项目实战经验分享:为什么你的多进程日志会丢失?
前端·人工智能·后端
柳杉1 小时前
让 AI 学会审美、建模和剪片:我收藏夹里的 14 个仓库
前端·ai编程·three.js
前端架构师-老李1 小时前
HTML与CSS基础第七课—HTML 中的a标签(跳转链接)
前端·css·html