循环选择所有选项并将值添加到选项名称

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (5)

我有一个具有不同值的选择。如果值包含文本“pa_course-date”并将其添加到选项名称“Course Date”,我想要做的是遍历每个选项

所以它写着“课程日期 - pa_course-date-aromatherapy”等

我不会从这个开始。如果一个javascript专家可以看看我会很高兴。

<option value="pa_course-date-aromatherapy">Course Date</option>
<option value="pa_course-date-basic-colouring">Course Date</option>
<option value="pa_course-date-body-wraps">Course Date</option>
<option value="pa_course-date-brow-tinting">Course Date</option>
<option value="pa_course-date-cold-fusion">Course Date</option>     
提问于
用户回答回答于

这应该工作正常

$(document).ready(function(){
	$("#select>option").each(function(){
  	$(this).text(this.text + ' - ' + this.value)
  })
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="select">
  <option value="pa_course-date-aromatherapy">Course Date</option>
  <option value="pa_course-date-basic-colouring">Course Date</option>
  <option value="pa_course-date-body-wraps">Course Date</option>
  <option value="pa_course-date-brow-tinting">Course Date</option>
  <option value="pa_course-date-cold-fusion">Course Date</option>     
</select>
用户回答回答于

试试这个:

const options = document.querySelectorAll('.attribute_taxonomy option');

options.forEach(o => {
  const currentValue = o.getAttribute('value');
  o.innerHTML = `Course Date - ${currentValue}`;
});

<select name="attribute_taxonomy" class="attribute_taxonomy">

<option value="pa_course-date-aromatherapy">Course Date</option>
<option value="pa_course-date-basic-colouring">Course Date</option>
<option value="pa_course-date-body-wraps">Course Date</option>
<option value="pa_course-date-brow-tinting">Course Date</option>
<option value="pa_course-date-cold-fusion">Course Date</option>     

</select>

扫码关注云+社区

领取腾讯云代金券