Question

在选择框更改事件DOM更改时发生（某些元素根据选择框值显示/隐藏）要重现此内容，请在示例中选择“清除”按钮。 SelectBox将不会被清除。一些选择选项将被设置为值。

$(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>

谢谢。

Answer 1

对我有用的解决方案：

清除选择时防止打开，如此处github
打开下拉菜单并超时。

Select2“ allowClear”在某些特定情况下不会清除选择框

1 个答案: