2010-11-16 41 views
6

我們的網站涉及一些生成覆蓋模式窗口的JavaScript。如何在JavaScript模式窗口上設置焦點?

儘管如此,一旦模態被觸發,focus仍然在觸發元素上,而不是在模態本身。

這些模式可以包括各種html元素,標題,段落和表單控件。我想要的是從模態內的第一個元素開始,所以最有可能是一個h4標記。

我已經探索了使用focus()函數,但是這不適用於一些html元素。

一個想法是在可以獲得焦點的窗口中添加一個空的a標籤,但我不確定這種方法。

回答

0

您可以將文本框添加到模態HTML的開頭,設置焦點,然後隱藏文本框。只要我瞭解你的需求,應該有理想的效果。

+1

多數民衆贊成在一種方式,但我不希望在代碼中添加空的文本框,無論是易於訪問和清潔的代碼 – user502014 2010-11-16 16:13:59

+0

@ user502014該文本框將不可見,因此可訪問性不應該是一個問題。如果你覺得有更清晰的代碼可以隨意使用它,只要記住你有「計劃B」準備就緒。 – 2010-11-16 20:16:39

4

晚會很晚,但現有的答案不尊重無障礙。

W3C wiki page on accessible modals提供了比什麼要求在OP中,相關部分具有模式容納(也應該有一個aria-dialog屬性)上tabindex=-1,使它能夠:focus更深入的瞭解。

這是設置模態焦點的最方便的方式,還有更多關於僅將模態保留在模態中的文檔 - 並將其返回到觸發模態的元素 - 這裏有相當多的解釋,所以我建議任何有興趣的人檢查上面的鏈接。