| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>多选组件</title>
- <link href="../../component/pear/css/pear.css" rel="stylesheet" />
- </head>
- <body class="pear-container">
- <div class="layui-row layui-col-space10">
- <div class="layui-col-md12">
- <div class="layui-card">
- <div class="layui-card-header">
- 开发环境
- </div>
- <div class="layui-card-body">
- Select 应用于 多选 场景
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-collapse">
- <div class="layui-colla-item">
- <h2 class="layui-colla-title">显示代码</h2>
- <div class="layui-colla-content">
- <pre class="layui-code" lay-encode="true">
- <link href="component/pear/css/pear.css" rel="stylesheet" />
- 并
- <script src="component/layui/layui.js"></script>
- 并
- <script src="component/pear/pear.js"></script>
- </pre>
- </div>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-card">
- <div class="layui-card-header">
- 默认主题
- </div>
- <div class="layui-card-body">
- <select name="city5" xm-select="select5" xm-select-skin="default">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-collapse">
- <div class="layui-colla-item">
- <h2 class="layui-colla-title">显示代码</h2>
- <div class="layui-colla-content">
- <pre class="layui-code" lay-encode="true">
- <select name="demo1" xm-selects="demo1" xm-select-skin="default">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </pre>
- </div>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-card">
- <div class="layui-card-header">
- 绿色主题
- </div>
- <div class="layui-card-body">
- <select name="city1" xm-select="select1">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-collapse">
- <div class="layui-colla-item">
- <h2 class="layui-colla-title">显示代码</h2>
- <div class="layui-colla-content">
- <pre class="layui-code" lay-encode="true">
- <select name="demo2" xm-selects="demo2">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </pre>
- </div>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-card">
- <div class="layui-card-header">
- 通用主题
- </div>
- <div class="layui-card-body">
- <select name="city2" xm-select="select2" xm-select-skin="normal">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-collapse">
- <div class="layui-colla-item">
- <h2 class="layui-colla-title">显示代码</h2>
- <div class="layui-colla-content">
- <pre class="layui-code" lay-encode="true">
- <select name="demo3" xm-selects="demo3" xm-select-skin="normal">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </pre>
- </div>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-card">
- <div class="layui-card-header">
- 警告主题
- </div>
- <div class="layui-card-body">
- <select name="city3" xm-select="select3" xm-select-skin="warm">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-collapse">
- <div class="layui-colla-item">
- <h2 class="layui-colla-title">显示代码</h2>
- <div class="layui-colla-content">
- <pre class="layui-code" lay-encode="true">
- <select name="demo4" xm-selects="demo4" xm-select-skin="warm">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </pre>
- </div>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-card">
- <div class="layui-card-header">
- 危险主题
- </div>
- <div class="layui-card-body">
- <select name="city4" xm-select="select4" xm-select-skin="danger">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </div>
- </div>
- </div>
- <div class="layui-col-md12">
- <div class="layui-collapse">
- <div class="layui-colla-item">
- <h2 class="layui-colla-title">显示代码</h2>
- <div class="layui-colla-content">
- <pre class="layui-code" lay-encode="true">
- <select name="demo5" xm-selects="demo5" xm-select-skin="danger">
- <option value="1">北京</option>
- <option value="2" selected="selected">上海</option>
- <option value="3">广州</option>
- <option value="4" selected="selected">深圳</option>
- <option value="5">天津</option>
- </select>
- </pre>
- </div>
- </div>
- </div>
- </div>
- </div>
- <script src="../../component/layui/layui.js"></script>
- <script src="../../component/pear/pear.js"></script>
- <script>
- layui.use(['select','code','element'], function() {
- let select = layui.select;
-
- layui.code();
- });
- </script>
- </body>
- </html>
|