当选择框更改事件DOM更改时发生(某些元素根据选择框值显示/隐藏( 要重现此内容，请单击示例中的"清除"按钮。不会清理选择框。某些选择选项将被设置为值。
$(document).ready(function(){
$('#selectList').select2({
width: '100%',
allowClear: true,
placeholder: 'select option',
value: null
}).on('select2:selecting', function (e) {
console.log('selecting');
}).on('select2:unselecting', function (e) {
console.log('unselecting');
}).on('select2:select', function (e) {
console.log('select');
}).on('select2:unselect', function (e) {
console.log('unselect');
}).on('change', function (e) {
console.log('change');
if(!e.value){
$('#some-data').hide();
}
else{
$('#some-data').show();
}
})
});.container{
min-width:100%;
min-height: 50px;
background: #3C401D;
}<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.js"></script>
<body>
<div id="some-data" class='container'>
</div>
<select id="selectList" name="first">
<option value="1" selected="selected">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</body>谢谢。
一个适合我的解决方案：
- 清除选择时阻止打开，如此处所述 github
- 打开带有一些超时的下拉列表。