layui xm-select的使用

一、文档

xm-select

二、使用

html 复制代码
<div id="js-form-tags{$ke}{$index++}" val="{$ke}"></div>
<input type="hidden" class="selectkey" name="selectkey[]" value="{$ke}" />
javascript 复制代码
function initSelect(id,init)
        {
            
            xmSelect.render({
                el: '#'+id, 
                model: { label: { type: 'text' } },
                tree: {
                    show: true,
                    showFolderIcon: true,
                    showLine: true,
                    indent: 20,
                    expandedKeys: [ -3 ],
                    strict: false,// 严格父子结构,true时,父级选中和取消选中其子级同步取消和选中;false时,父级不会影响子级的选中,注意位置在内层
                },
                radio: true,//控制单选和多选
                expandedKeys: [],
                clickClose: true,
                language: 'zn',
                size: 'mini',
                single: true,
                style:{width:'215px',border: '1px solid #468',minHeight:'22px'},
                theme: {
                    color: '#1E9FFF',
                },
                show(){
                    console.log('show')
                    
                },
                on(data){
                    console.log(data)
                    console.log('on')
                    console.log($(this))
                    $("#"+id).siblings('input').val(data.change[0].value)
                },
                hide(){
                    console.log('hide')
                    setTimeout(() => {
                        $("#"+id).find('xm-select').css('border','1px solid #468')
                    }, 1);
                },
                initValue: [init],// 下拉框需要有初始选中值时,赋值此项
                height: '200px',
                searchTips: '搜索',// 是否显示搜索框
                filterable: true,// 是否显示搜索框
                toolbar: {
                    show: false,
                    list: ['ALL','CLEAR']
                },// 是否显示清空和全选
                data: JSON.parse(tags)
            })
        }
相关推荐
Highcharts.js4 小时前
Highcharts大数据渲染模块Boost实战与参数最佳实践表
javascript·数据可视化·boost·highcharts·大数据渲染·加速配置·参数表
岁岁种桃花儿4 小时前
Vue核心语法第一篇:Vue是什么?
前端·javascript·vue.js
Highcharts.js5 小时前
数据可视化避坑指南 ——开发中常见图表错误与修复方案
javascript·信息可视化·数据可视化·highcharts·数据可视化避坑·修复方案
观无5 小时前
若依EasyExcel实现单元格合并
开发语言·前端·javascript
愚公搬代码5 小时前
【愚公系列】《Web应用安全》001-VMware的安装
前端·安全
xiaohaiAIgeo5 小时前
【2026年】HG/T 20656-2024化工暖通空调设计规范:新版标准的变化与影响
java·前端·javascript·科普知识
立少→万能汉编5 小时前
用“立少→超文本”写静态网页,标签<倍>
服务器·前端·javascript
weixin_431600445 小时前
NestJS 入门(7):生命周期钩子——构造函数和 `OnModuleInit` 差在哪?
前端·后端·学习·node.js·nest.js
你挚爱的强哥6 小时前
【chromeDownload】自定义组件:多用于登录框底部提供下载Chrome谷歌浏览器的链接
前端·vue.js·chrome
cindershade6 小时前
用原生 HTML5 视频与 Canvas 实现浏览器端视频抽帧封面
前端