从 select2 中删除跨度

Question

我正在使用生成您的选择的 select2，我有这个，并且我需要从 span:

中删除 'x'

此代码打印 span 元素：

 for (let i = 0; i < valores.length; i++) {
     const option = new Option(valores[i]['nombre'], valores[i]['nombre'], true, valoresLocalStorage.includes(valores[i]['nombre']));
     valoresSelect.append(option).trigger('change');
 }

 valoresSelect.closest('[data-controller="fields--select"]').find('.select2-selection__choice').each(function () {
          console.log($(this).find('.select2-selection__choice__remove'));
          console.log('Span');

         $(this).find('.select2-selection__choice__remove').hide();
 });

在 chrome 中显示 console.log 但不隐藏它：

EVdn.k.fn.init [span.select2-selection__choice__remove, prevObject: EVdn.k.fn.init(1)] asociar:815 Span

Answer 1

您可以使用 display: none !important; 隐藏 select2 下拉菜单中的关闭按钮

演示代码 :

$("#somethings").select2();
$('#somethings').val(['1', '2']);
$('#somethings').trigger('change');

.select2-selection__choice__remove {
  display: none !important;
}

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/select2.min.css">
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/js/select2.min.js"></script>


<select class="form-control2 select2" multiple="multiple" id="somethings">
  <option value="">-Selecr-</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>

</select>

使用 jquery 的其他方式：

var valoresSelect = $("#somethings")
valoresSelect.select2()
//this is just for demo...
valoresSelect.val(['1', '2']);
valoresSelect.trigger('change');
remove_buttn();
//use this if you need to hide when user select other opitons..same do for https://select2.org/programmatic-control/events
valoresSelect.on('select2:select', function(e) {
  remove_buttn();
});

function remove_buttn() {
  //use next here
  valoresSelect.next().find('.select2-selection__choice').each(function() {
    $(this).find('.select2-selection__choice__remove').hide();
  });
}

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/select2.min.css">
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/js/select2.min.js"></script>

<select class="form-control2 select2" multiple="multiple" id="somethings">
  <option value="">-Selecr-</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>

</select>

从 select2 中删除跨度

Remove span from select2

jquery

jquery-select2