如果你使用的是Angular(2+)，(或任何其他框架)，你可以添加一些逻辑。逻辑是:如果用户还没有选择任何其他选项，则只显示一个空选项。 因此，在用户选择了一个选项之后，空选项就会消失。

对于Angular(9)，它看起来像这样:

<select>
    <option *ngIf="(hasOptionSelected$ | async) === false"></option>
    <option *ngFor="let option of (options$ | async)[value]="option.id">{{ option.title }}</option>
</select>

选择风格= "显示:没有"

平板电脑:iPad Pro / iOS 15 / Safari的糟糕解决方案 下拉菜单中出现了一个不必要的行，仅用于实际设备。不会在模拟器上重现。

这应该会有帮助:

https://www.w3schools.com/tags/att_select_required.asp

< >形式 需要<选择> <选项值= " " > < /选项>没有 沃尔沃<选项值=“沃尔沃”> < /选项> 萨博<选项值= "萨博" > < /选项> <选项值= "奔驰" >奔驰> < /选项 <选项值=“奥迪”>奥迪> < /选项 < /选择> <按钮类型=“提交”> > < /按钮提交 > < /形式

在react中，你可以用下面的选择标签给出一个虚拟值(比如-1)，同样的值可以用你的这个禁用选项。(为我工作)

const nonEmpty = selected[identifierField] || false;

<select
    onChange={(e) => {
      onSelect(
        options.find((option) => option[identifierField] === e.target.value)
      );
    }}
    value={nonEmpty || -1}
  >
    <option disabled value={-1}>Select Option</option>
    {options.map((option) => (
      <option key={option[identifierField]} value={option[identifierField]}>
        {option[displayField]}
      </option>
    ))}
  </select>

为了显示，请在下拉菜单中选择一个值，并在选择某个值后隐藏它。请使用下面的代码。

它还将支持所需的验证。

<select class="form-control" required> <option disabled selected value style="display:none;">—请选择一个值</option> . <option >Data 1</option> . <option >Data 2</option> <option >Data 3</option> . < /选择>

您可以使用Javascript来实现这一点。试试下面的代码:

HTML

<select id="myDropdown">      
    <option>Option 1</option>     
    <option>Option 2</option>     
    <option>Option 3</option>     
</select> 

JS

document.getElementById("myDropdown").selectedIndex = -1;

或JQuery

$("#myDropdown").prop("selectedIndex", -1);