bootstrap select 多选 搜索框 分组 常用
bootstrap select 多选 搜索框 分组 常用
用户5760343
发布于 2019-07-08 12:14:47
发布于 2019-07-08 12:14:47
image.png
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>联想控股</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="css/bootstrap-select.css" rel="stylesheet" type="text/css">
<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-select.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<label class="col-sm-3 control-label" style="line-height: 34px;margin-bottom: 20px;">选择用户：</label>
<div class="col-sm-6">
<select class="form-control selectpicker" data-live-search="true" multiple>
<optgroup label="广东省">
<option value="1">广州市</option>
<option value="2">深圳市</option>
<option value="3">珠海市</option>
</optgroup>
<optgroup label="广西">
<option value="1">南宁市</option>
<option value="2">柳州</option>
<option value="3">桂林市</option>
</optgroup>
<optgroup label="山东">
<option value="1">烟台</option>
<option value="2">青岛</option>
<option value="3">济南</option>
</optgroup>
</select>
</div>
</div>
</div>
</body>
</html>本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2019.06.04 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读