Javascript <；上的默认空白选项；选择>；狩猎旅行

我试图创建一个

，其中第一个

为空，在下拉列表中不可见，也不可选择

我已经研究了4个小时了。我看到了很多工作选择，但问题是没有一个（或者至少是我发现的）在Safari上工作

这是我的代码：

{{subindustry.label}

我没有使用jQuery。

如果您使用like

      <select>
         <option> Select Option </option> // replace above code with 
         <option value='' selected> Select Option </option>
      </select>

选择选项//将上述代码替换为
选择选项

---

希望这能奏效。

这对你有用吗？可以设置选项的样式属性并禁用该字段，使其不再可选。这个问题似乎已经在另一篇帖子中得到了回答

一
三

只需添加值未定义的选项，即可强制angular选择该值。如下

<select class="custom-select" formControlName="subindustryName">
    <option value="undefined"></option>
    <option *ngFor="let subindustry of subIndustries" 
    [value]="subindustry.value">{{subindustry.label}}</option>
</select>

{{subindustry.label}

如果您想让它不可选择，则添加“禁用”属性

根据评论进行编辑

所以，无论你在问题中粘贴什么都应该有效。 这是我正在工作的代码片段

<div class="form-group">
  <label class="col-md-3 control-label">Gender</label>
    <div class="col-md-3">
      <select id="gender" class="form-control" [(ngModel)]="userModel.gender" name="gender" required >
        <option value="male">Male</option>
        <option value="female">Female</option>
      </select>
    </div>
</div>

性别
男性
女性

只需尝试“subindustryName”的模板驱动方法并选中。

选择选项
<option disabled selected value>Select Option</option>
<option value="one">one</option>
<option value="two">two</option>

一
二

---

在Safari和Chrome中，默认禁用的选定值为该值

你能分享一下代码吗？也许这会有所帮助：我已经试过了这些帖子中的几乎所有内容，但它对我不起作用。我已经试过了，这是我能做的最好的了。当它第一次显示下拉列表时，选项仍然出现在那里，我不喜欢没有禁用的选项。禁用时，它甚至不会使“选择”为空。只会将其设置为空白，但仍可以在下拉列表中选择。不确定，这可能与safari有关。大多数用户可能不会注意到或在意。实际上，这是为客户机设计的，他认为您可以使用css和鼠标悬停选择进行下拉，并使用一点javascript设置隐藏字段。它比选项字段复杂得多，但它应该完成同样的任务。更糟糕的是，如果没有javascript.ok，这种类型的下拉列表将无法工作，因此工作正常，与添加禁用属性时一样，在我选择另一个值之前，它仍然显示在下拉列表栏上。这是我能得到的最好的例子，但我想如果它一开始在下拉列表中不可见那就太好了。只是编辑了我的答案。尝试模板驱动的方法并检查它是否有效。如果它有效，那么你可以用反应式方法检查问题所在