如何防止选择添加到选择元素的新选项？答案

【问题标题】：How to prevent select of new option added to select element?如何防止选择添加到选择元素的新选项？
【发布时间】：2020-09-11 20:41:20
【问题描述】：

我正在添加新选项来选择标签，我不想选择其中任何一个。我尝试了几种方法来做到这一点，但每次都选择第一个选项。代码如下：

const $selectField = $('.clsname');
const array = ['option1', 'option2', 'option3'];
$selectField.empty();
array.forEach(function(iter, elem) {
  $selectField.append(new Option(iter, elem, false, false));
});
$selectField.show();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select hidden class="clsname"></select>

据我了解，使用new Option() 和defaultSelected 并选择设置为false 应该可以解决问题。

另外，我尝试在forEach 之后添加类似的内容，但它也不起作用。

$selectField.children("option:selected").prop("selected", false);

【问题讨论】：

这个有用吗：stackoverflow.com/questions/22033922/…?
如果不希望它们被选中，那么添加它们有什么用？
@AndrewHalpern 很遗憾没有
@Mamun 我希望用户选择它们，并且在他决定选择哪个选项之前不应该选择任何选项
这个怎么样？设置空先开？ stackoverflow.com/questions/24332437/…

标签： javascript html jquery

【解决方案1】：

添加选项后，您可以将选择字段的值设置为null。

$('#mySelect').val(null)

for(var i = 1; i < 5; i++) {
	$option = $('<option></option>').text('Option ' + i).val(i);
	$('select').append($option);
}
$('select').val(null)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>


</select>

【讨论】：