Select2 删除选项在 jquery 中不起作用答案

【问题标题】：Select2 remove option not working in jquerySelect2 删除选项在 jquery 中不起作用
【发布时间】：2021-05-31 13:08:19
【问题描述】：

我想删除 select2 选项并将其设为默认输入。通过使用$("#City").text('').trigger('change'); 触发器更改，我可以清除 select2 数据，而不是删除全部 select2 下拉列表。任何人都可以帮我删除它。

到目前为止，我已经尝试过以下脚本：

$('#City').val(null).trigger('change');
$('#City').val('')
$("#city").empty()

供参考：

$('select').select2();

.select2-container {
  min-width: 120px;
}

<link href="http://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>

<select id="City">
<option value="None">None</option>
<option id="one" value="1">One</option>
<option value="2">Two</option>
</select>

【问题讨论】：

目前你的样本抛出"TypeError: $(...).select2 is not a function"，你能先解决这个问题吗？
@Tomalak 我已经解决了这个问题。你能检查一下这个问题吗
不，你的 sn-p 仍然没有运行。

标签： javascript html jquery jquery-select2

【解决方案1】：

您可以使用$("#City").select2('destroy') 销毁select2，然后使用replaceWith 将其替换为普通文本框。

演示代码：

$(document).ready(function() {
  $('select').select2();
  $("#City").select2('destroy'); //destroy..plugin
  $("#City").replaceWith("<input type='text' id='City'>") //replace..
})

.select2-container {
  min-width: 120px;
}

<link href="http://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>

<select id="City">
  <option value="None">None</option>
  <option id="one" value="1">One</option>
  <option value="2">Two</option>
</select>

【讨论】：

没有。我想删除整个 Select2 下拉菜单并像普通输入框一样更改它
普通选择框然后尝试$("#City").select2('destroy'); ？您的问题不清楚，您的问题标题说明了其他内容。
我已经更新了截图供大家参考
对不起。这是一个动态值。我无法使用replaceWith
动态值 ..这是什么意思？请详细说明，即使您销毁select2，它也会为您提供正常的选择框而不是输入框，因此如果您需要输入框，则需要替换它。

【解决方案2】：

你可以用这个

$("#City option[value='2']").remove();

$("#City option[value='1']").remove();

【讨论】：

我正在为我的项目获取动态值。这个答案没有帮助。
$(#City option[value='${value}']).remove();