保留重點關閉模式或彈出窗口

我對可訪問性有疑問。有幾個圖層/模塊或彈出窗口，只需點擊一個按鈕或鏈接即可打開。保留重點關閉模式或彈出窗口

我需要將焦點保留在原始元素上，點擊該元素打開模式或彈出窗口或彈出窗口，一旦它們關閉，焦點應該返回到單擊元素。當我在頁面上標籤關閉模態窗口或彈出按鈕後，焦點從begining

我使用的角度引導模式，並通過角狀態提供配置打開自定義彈出窗口開始

目前。

2017-04-25 Shashi

從打開模式/彈出的事件中保存事件目標，並在模態/彈出關閉時將焦點設置在該目標上。請參閱[MDN HTML元素參考 - 焦點方法]（https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus）。 – georgeawg

通過打開模式之前，保持目前的工作重點解決了上述問題，並恢復焦點返回時模態關閉

來源

2017-08-21 14:29:34 Shashi

的官方建議從WAI-ARIA Authoring Practices - Modal Dialog狀態：

當對話框關閉，焦點返回到調用對話框的元素，除非：

調用元素不再存在。然後，將焦點設置在提供邏輯工作流程的另一個元素上。

工作流設計包括以下條件的，可以偶爾會聚焦不同的元素一個更合乎邏輯的選擇：

這是不太可能的用戶需要立即重新調用對話框。

對話框中完成的任務直接與工作流程中的後續步驟相關。

將焦點移回到你的模式打開之前的重點元素：

之前打開模式，參考保存到document.activeElement。
關閉模式後，focus參照前面的activeElement。

例子：

let previousActiveElement = document.activeElement; 
// Open and close the modal 
if (document.body.contains(previousActiveElement)) { 
    previousActiveElement.focus(); 
}

來源

2017-09-05 06:58:07 Peter

將焦點移回到你的模式打開之前的重點元素：

打開模式之前，請保存到document.activeElement參考。關閉模式後，將引用集中到前一個activeElement。

來源

2017-09-22 14:51:21 Shashi

保留重點關閉模式或彈出窗口

回答

相關問題