有没有办法限制 Selectize 字段的最大高度?
Is there a way to limit the max height of a Selectize field?
有没有办法限制 Selectize 字段的最大高度?字段本身,而不是下拉列表。该字段不限制最大选择数,因此我不能使用 maxItems
选项,也不能使用 maxOptions
选项,因为它适用于下拉列表。
(function($select) {
for (let i = 100; i < 202; ++i) {
$select.append('<option value="' + i + '" selected>Test ' + i + '</option>');
$select.append('<option value="' + (2 * i) + '">Test ' + (2 * i) + '</option>');
}
$select.selectize();
})($("#selectize"));
#container {
max-width: 400px;
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.13.3/css/selectize.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.13.3/css/selectize.bootstrap3.min.css" rel="stylesheet" />
<div id="container" style="">
<form>
<select id="selectize" name="selectize" class="form-control" multiple></select>
<button type="submit" class="btn btn-success">Submit</button>
</form>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.13.3/js/standalone/selectize.min.js"></script>
将 select
字段包装在容器中,将 CSS max-height
和 overflow-y
设置为“自动”,然后设置选择选项 dropdownParent
到“body”似乎解决了问题。
有没有办法限制 Selectize 字段的最大高度?字段本身,而不是下拉列表。该字段不限制最大选择数,因此我不能使用 maxItems
选项,也不能使用 maxOptions
选项,因为它适用于下拉列表。
(function($select) {
for (let i = 100; i < 202; ++i) {
$select.append('<option value="' + i + '" selected>Test ' + i + '</option>');
$select.append('<option value="' + (2 * i) + '">Test ' + (2 * i) + '</option>');
}
$select.selectize();
})($("#selectize"));
#container {
max-width: 400px;
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.13.3/css/selectize.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.13.3/css/selectize.bootstrap3.min.css" rel="stylesheet" />
<div id="container" style="">
<form>
<select id="selectize" name="selectize" class="form-control" multiple></select>
<button type="submit" class="btn btn-success">Submit</button>
</form>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.13.3/js/standalone/selectize.min.js"></script>
将 select
字段包装在容器中,将 CSS max-height
和 overflow-y
设置为“自动”,然后设置选择选项 dropdownParent
到“body”似乎解决了问题。