layui多选下拉框

HTML代码

 <select class="param_belong" multiple="multiple" 
 					lay-filter="selectTest" name="belong">
         <option value=""></option>
          <option
             th:each="type, typeS: ${belong}"
             th:value="${type.objId}"
             th:text="${type.name}"
             th:selected="${type.selected}"></option>
  </select>

导入js

<script th:src="@{/js/multiSelect.js}" charset="utf-8"></script>

我使用时候 以上就可以实现多选下拉框的功能；我新增和修改页面用的同一个页面，但点击修改页面时，多选框变成了单选框，点击新增页面却无问题。后来发现是因为layui渲染的问题。加上下面代码即可解决

在layui注册下拉框

layui.use(['upload', 'element', 'form', 'layer', 'laydate', "multiSelect"], function () {
       layui.multiSelect.render('select','selectTest');
    });

js文件我就不分享了，自己复制代码 新建js文件粘贴进去吧！文件名称取：multiSelect.js 嗷！

layui.define("form", function(exports) {
	var MOD_NAME = "multiSelect",
		o = layui.jquery,
		form = layui.form,
		selected_vals = [],
		multiSelect = function() {};

	multiSelect.prototype.init = function() {
		var ts = this;
		o('select[multiple]').each(function(idx, item) {
			var t = o(this),
				selds = [];
			t.find('option:selected').each(function() {
				selds.push(o(this).val());
			})
			t.next().addClass('multi').find('.layui-select-title').click(function() {
				selected_vals[idx] && o(this).find('input').val(selected_vals[idx].join(','));
			}).next().find('dd').each(function() {
				var dt = o(this),
					checked = (dt.hasClass('layui-this') || o.inArray(dt.attr('lay-value'), selds) > -1) ? 'checked' : '',
					title = dt.text(),
					disabled = dt.attr('lay-value') === '' ? 'disabled' : '';
				dt.html('<input type="checkbox" lay-skin="primary" title="' + title + '" ' + checked + ' ' + disabled + '>');
				ts.selected(idx, t, dt);
			}).click(function(e) {
				var dt = o(this);
				// 点击下拉框每一行触发选中和反选
				if(e.target.localName == 'dd' && dt.attr('lay-value') !== '') {
					var status = dt.find('.layui-form-checkbox').toggleClass('layui-form-checked').hasClass('layui-form-checked');
					dt.find('input').prop('checked', status);
				}
				// 禁止下拉框收回
				dt.parents('.layui-form-select').addClass('layui-form-selected');
				ts.selected(idx, t, dt);
			});
		})
		form.render('checkbox');
	}

	multiSelect.prototype.selected = function(idx, t, dt) {
		// 选中值存入数组
		selected_vals[idx] = [];
		// 先清除真实下拉款选中的值，在下面循环中重新赋值选中
		t.find('option').prop('selected', false);
		dt.parents('dl').find('[type=checkbox]:checked').each(function() {
			var val = o(this).parent().attr('lay-value');
			t.find('option[value=' + val + ']').prop('selected', true);
			selected_vals[idx].push(o(this).attr('title'));
		})
		// 显示已选信息
		dt.parents('dl').prev().find('input').val(selected_vals[idx].join(','));
	}

	multiSelect.prototype.render = function(type, filter) {
		form.render(type, filter);
		this.init();
	}

	var i = new multiSelect();
	i.init();

	exports(MOD_NAME, i);
});