HTML

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 中看到空白行

有人可以给我建议吗？

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>

输出：

HTML | Select 标记 | AngularJS | Safari 和资源管理器中显示空白选项

HTML | Select Tag | AngularJS | Blank option are displayed in Safari and Explorer

javascript

safari

internet-explorer

angularjs