layui下拉多选框怎么实现?类似于下面这种效果的。

网友回复
使用xmselect

完整示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<!-- layui css -->
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/js/layui/css/layui.css">
<!-- layui js -->
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/layui/layui.all.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/xm-select.js"></script>
</head>
<body style="min-height: 1000px;">
<div class="layui-container">
<!-- 拷贝整个.layui-card 即可 -->
<div class="layui-card" id="userinfo">
<div class="layui-card-header">下拉框多选:默认选中,远程搜索等常用参数</div>
<div class="layui-card-body">
<form class="layui-form" action="" lay-filter="info">
<div class="layui-form-item">
<div id="demo1"></div>
</div>
</form>
<script>
var options = {
el: '#demo1',
name: 'xmselectName',//表单的name属性
layVerify: 'required',//必填项
//layVerType: 'tips',//提示类型 同layui
tips: '你喜欢什么水果呢?傻瓜教程',
toolbar: {//工具条,全选,清...点击查看剩余70%


