我在 bootstrap 4 中有一个选择器代码,它工作正常,但我想添加一个不在选择选项中的自定义选项。所以,伙计们请提供给我。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.7.0/chosen.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.7.0/chosen.jquery.min.js"></script>
<style>
body {
padding: 1em;
}
.wrapper+.wrapper {
margin-top: 20px;
}
</style>
</head>
<body>
<div class="wrapper">
<select multiple>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<button type="button" class="chosen-toggle select">Select all</button>
<button type="button" class="chosen-toggle deselect">Deselect all</button>
</div>
<script>
$('select').chosen({ width: "300px" });
$('.chosen-toggle').each(function (index) {
console.log(index);
$(this).on('click', function () {
console.log($(this).parent().find('option').text());
$(this).parent().find('option').prop('selected', $(this).hasClass('select')).parent().trigger('chosen:updated');
});
});
</script>
</body>
</html>
在此输入选项中已经选择和取消选择按钮,您可以添加另一个按钮以添加按钮以添加新选项但不是另一个输入,已经给出的输入正在运行搜索过滤器