Bootstrap-multiselect 显示问题
div的高度是固定的,但是查询条件需要很多,所以div的style添加了overflow:auto;但是加了这个属性后,下拉框就没有悬浮在最上层了..而是只显示在div内,需要拖动滚动条才能查看.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<script src="jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="bootstrap.min.js"></script>
<script type="text/javascript" src="bootstrap-multiselect.js"></script>
<script type="text/javascript" src="bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src="bootstrap-datetimepicker.zh-CN.js"></script>
<link rel="stylesheet" href="bootstrap.min.css" type="text/css"/>
<link rel="stylesheet" href="bootstrap-multiselect.css" type="text/css"/>
<link rel="stylesheet" href="bootstrap-datetimepicker.min.css" type="text/css"/>
</head>
<body>
<div style="width:500px;height:150px;background:yellow;overflow:auto">
<table>
<tr>
<td>
<select id="text" name="text" multiple="multiple">
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
<option value="a" selected>A</option>
</select>
</td>
</tr>
</table>
</div>
<div style="width:500px;height:150px;background:blue">
</div>
</body>
</html>
<script>
$(document).ready(function(){
$("#test").multiselect({
nonSelectedText:"",
includeSelectAllOption: true,
enableFiltering: true,
numberDisplayed: 100,
maxHeight:200
});
});
</script>
3 个回复
tz
赞同来自:
快乐的胖子
赞同来自:
爱
赞同来自: