Question

我正在使用iphone 6+和语音覆盖（辅助功能）选项。我在链接点击时打开了退出模式，并将键盘焦点设置在模态上（使用js）。一切正常。但是，对焦的声音没有切换到我的模态，它仍然在触发链接上。

如何将声音重点转移到模态？这是模态代码

<div class="modal-container" id="{{ modalModel.modalId }}">
    <div class="modal-mask" data-ng-click="onMaskClick($event)">
    </div>
    <div class="modal-body" tabindex="-1" role="dialog" aria-label="{{ modalModel.modalTitle }}">
        <div class="modal-body-container">
            <h4 class="modal-title heading-4">{{ modalModel.modalTitle }}</h4>
            <button type="button" class="modal-close" data-ng-click="closeModal($event)">
                <span class="btn-text">close</span>
                <span class="icon chrome-blue-x-round"></span>
            </button>
            <div class="modal-contents">
                <div class="modal-contents-wrapper" data-ng-transclude></div>
                xxxxxx xxxx
            </div>
        </div>
    </div>
</div>

当弹出模态时，modal-body类元素具有焦点。我正在使用iOS 9。

Answer 1

当模态打开时，我可以通过将键盘焦点放在关闭按钮上来将光标聚焦在模态中。

如果键盘焦点不在键盘可以自然聚焦的元素上，那么光标上的声音就不会在模态内部移动。由于关闭按钮是一个按钮，这个工作

        <button type="button" class="modal-close" data-ng-click="closeModal($event)">
            <span class="btn-text">close</span>
            <span class="icon chrome-blue-x-round"></span>
        </button>

Answer 2

您必须专注于可聚焦的项目。如果要将其设置为通常不可聚焦的内容，请添加tabindex = 0。还有其他一些快速技巧让VO读取整个模态。添加aria-labelledby =“id_of_title”aria-describedby =“id_of_content”不要使用散列'＃'。

如何将焦点转移到我的模态？

2 个答案: