javascript - 选择更改前不可见的 <选项> 文本

Question

我遇到了 <select> 的奇怪视觉问题<option>元素。我有一个函数，每次特定的 <option> 时都会运行选自<select>下拉菜单，然后此代码设置要选择的选择元素的选项之一，这是通过以下方式发生的:

$('select[name="data[ApplicationPayday][EmpIndustry]"]').find('option[value=""]').attr('selected', true)

获取选定值的选择是:

<select class="custom-select" id="EmpIndustry" name="data[ApplicationPayday][EmpIndustry]" aria-describedby="EmployerIndustryHelp" required>
  <option value="" selected>Please Select</option>
  <option value="10">Health</option>
  <option value="22">Retail</option>
</select>

但是，尽管菜单中存在有效选项，但选择的文本是不可见的。

知道为什么吗？

复制网址:https://codepen.io/sts-ryan-holton/pen/LKJbzL

Answer 1

使用下面的代码。

$('select[name="data[ApplicationPayday][EmpIndustry]"]').find('option[value=""]').prop('selected', true);