javascript - HTML | 选择标签 | AngularJS | Safari 和资源管理器中显示空白选项

Question

我使用下一个 html + Angulrjs 代码是为了创建一个下拉列表。

 <li class="category-li" ng-if="!eventDetailsCtrl.showRule && !(eventDetailsCtrl.pageType == 'incident' || eventDetailsCtrl.pageType == 'anomaly')"><span class="fontBold">Close Reason: &nbsp;</span>
                    <select class="event-details-category-select" ng-model="eventDetailsCtrl.eventData.closingReason" name="" id="category" ng-options="category for category in eventDetailsCtrl.categories" ng-change="eventDetailsCtrl.categoryUpdate(eventDetailsCtrl.eventData.closingReason)">
                        <option value="" ng-show="false"></option>
                    </select>
</li>

起初，下拉列表显示空白选项（一个空选项）除了来自类别的选项，所以我添加了这一行

<option value="" ng-show="false"></option>

它适用于 Chrome、Firefox 和 Edge 但我仍然在 Explorer11 和 safari 中看到空白行

有人可以给我建议吗？

标签： javascripthtmlangularjsinternet-explorersafari

Answer 1

我建议你<option value="" ng-show="false"></option>用<option value="" disabled selected>--Select--</option>.

它可以帮助您解决 IE 11 浏览器的问题。

<span class="fontBold">Close Reason: &nbsp;</span>
<select >
<option value="" disabled selected>--Select--</option>
<option value="1">Reason-1</option>
<option value="2">Reason-2</option>
<option value="3">Reason-3</option>
</select>

输出：