700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > select实现---多选下拉框

select实现---多选下拉框

时间:2022-01-14 04:45:06

相关推荐

select实现---多选下拉框

select列表多选下拉框

注意:formSelects v4的一些操作:

/zyc050707/article/details/109809503

1.引入文件formSelects-v4.css和formSelects-v4.min.js

2.在相关的select列表中按照如下格式,进行填写,便可以实现下拉多选(这里是在ftl中实现)

<div class="layui-row layui-col-space1"><div class="layui-col-xs6"><div class="layui-form-item"><label class="layui-form-label label-required-four">场景类型</label><div class="layui-input-block"><select multiple="multiple" id="add-sceneType" name="add-sceneType" lay-filter="add-sceneType" lay-verify="required" lay-search xm-select="addSceneTypeXmSelect" xm-select-show-count="1" xm-select-skin="default" xm-select-search-type="dl" xm-select-search><#if (sceneTypeList?size>1)><option value=""></option></#if><#list sceneTypeList! as temp><option style="font-size: 13px" value="${temp.transferId!}">${temp.transferValue!}</option></#list></select></div></div></div><div class="layui-col-xs6"><div class="layui-form-item"><label class="layui-form-label label-required-four">触点来源</label><div class="layui-input-block"><select multiple="multiple" id="add-inModeCode" name="add-inModeCode" lay-filter="add-inModeCode" lay-verify="required" lay-search xm-select="addInModeCode" xm-select-show-count="2" xm-select-skin="default" xm-select-search-type="dl" xm-select-search><#--<#if (inModeCodeList?size>1)><option value=""></option></#if><#list inModeCodeList! as temp><option value="${temp.transferId!}">${temp.transferValue!}</option></#list>--><#if (inModeCodeList?size>1)><option value=""></option></#if><#list inModeCodeList! as temp><option value="${temp.transferId!}">${temp.transferValue!}</option></#list></select></div></div></div></div>

<select multiple="multiple" id="add-sceneType" name="add-sceneType" lay-filter="add-sceneType" lay-verify="required" lay-search xm-select="addSceneTypeXmSelect" xm-select-show-count="1" xm-select-skin="default" xm-select-search-type="dl" xm-select-search><#if (sceneTypeList?size>1)><option value=""></option></#if><#list sceneTypeList! as temp><option style="font-size: 13px" value="${temp.transferId!}">${temp.transferValue!}</option></#list></select>

3.在js文件中取值

(1)var formSelects = layui.formSelects;

(2)根据上一步,进行取值

//获取select下拉列表--多选框选中内容--数据形式//var addSceneTypeArray = formSelects.value('addSceneTypeXmSelect','val');//获取select下拉列表--多选框选中内容--内容//var addSceneType = formSelects.value('addSceneTypeXmSelect','valStr');

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。