在 Javascript 中设置下拉值

Question

我有一个包含以下 HTML 的下拉列表。

<select name="custom_123" id="custom_123_123" class="custom form-control form-control-full form-select searchable  abcd-done" style="display: none;">
<option value="" selected="selected">None</option>
<option value="1">Alaska</option>
<option value="2">Newyork</option>
</select>
<div id="custom_123_123_abcd" class="abcd-container abcd-container-single abcd-container- 
active" style="width: 100%"><a href="javascript:void(0)" class="abcd-single" 
tabindex="-1"><span>Alaska</span></a>
</div>

我希望能够在下拉列表中选择 Newyork。 为此，我在以下期间。

var dropdown_id = document.querySelector('[id^="custom_123"]').id;
var dropdown_abcd = dropdown_id + 'abcd';
document.getElementById(dropdown_abcd).getElementsByClassName("abcd-single")[0].innerHTML = "Alaska";

但同样没有得到应用。 任何人都可以帮忙吗？

Answer 1

这是基于您的代码的示例：

const select = document.querySelector('[id^="custom_123"]');
select.value = 'Alaska';

评论更新
如果选择上有侦听器，这里是一个关于如何触发更改事件的示例。

const select = document.querySelector('[id^="custom_123"]');
select.value = 'Alaska';
select.dispatchEvent(new CustomEvent('change'));