选项卡顺序在IE 11中重置

Question

我里面有一个div和一个按钮。单击该按钮时，三个不同的按钮显示在同一个div中。

使用键盘导航（预期）：当我选中按钮并按Enter键时，会显示三个不同的按钮，然后当我再次选中时，焦点应该转到这三个按钮中的第一个。此预期行为在Chrome和Firefox中正常运行，但在IE 11中无效。

在IE 11中，当我在主按钮上按Enter键时，选项卡将重置并转到页面上的第一个元素。当我多次选中时，它会跟随整个订单，现在来到三个按钮中的第一个。

<div class="blah-list">
        <div *ngFor="let blah of blahs" class="panel panel-default">
            <a href="#/{{blah.id}}" *ngIf="showOption !== blah.id" class="panel-body">
                Hello World
            </a>
            <button *ngIf="showOption !== blah.id" type="button" class="close" (click)="showOption=blah.id" [title]="Options">
                   <span class="glyphicon glyphicon-option-vertical"></span>
            </button>
            <div *ngIf="showOption === blah.id"(clickoutside)="showOption=null">
                <button type="button" class="A" [title]="A"></button>
                <button type="button" class="B" [title]="B"></button>
                <button type="button" class="C" [title]="C"></button>
            </div>
            <button *ngIf="showOption === blah.id" type="button" class="close">
                <span class="glyphicon glyphicon-option-vertical" (click)="showOption=null"></span>
            </button>
        </div>

如何防止这种情况发生？为什么IE表现不同？