gpt4 book ai didi

javascript - 在列表框中生成 "selected"html 标签

转载 作者:行者123 更新时间:2023-12-01 07:38:00 26 4
gpt4 key购买 nike

我有一个名为“Bookly”的 WordPress 插件。它生成一个包含一些值的列表框。我需要通过 Jquery 获取选定的值,但是当我选择一个值时,此选择框不会生成 selected="selected"。

我怎样才能实现这个目标?

PHP 文件:

<select id="service" class="bookly-select-mobile bookly-js-select-service">
<option value=""><?php echo esc_html( Common::getTranslatedOption( 'bookly_l10n_option_service' ) ) ?></option>
</select>

HTML 渲染:

<select id="service" class="bookly-select-mobile bookly-js-select-service">
<option value="">Choose a service</option>
<option value="1">Service 1</option>
<option value="2">Service 2</option>
</select>

我需要什么:

<select id="service" class="bookly-select-mobile bookly-js-select-service">
<option value="">Choose a service</option>
<option value="1" selected="selected">Service 1</option>
<option value="2">Service 2</option>
</select>

最佳答案

const service = document.getElementById('service');

service.addEventListener('click', (e) => {

// wipe previous 'selected' elements
Array.from(e.target.querySelectorAll('option')).forEach((option) => {
option.removeAttribute('selected');
});

e.target.querySelector(`option[value="${e.target.value}"`).setAttribute('selected', 'selected');
});

这是一个JSFiddle您可以在其中看到它的实际效果。

关于javascript - 在列表框中生成 "selected"html 标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59854918/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com