2 回答

TA貢獻1811條經驗 獲得超5個贊
彈出層的焦點問題我覺得他已經成為如今互聯網應用中最典型和棘手的可用性問題之一,尤其對使用讀屏軟件的視障用戶。
具體的實現我沒有經驗,但我覺得下面幾點必須重視:
1 fbocus到彈出層內的一個元素上(這可以是彈出層里的第一個可設定焦點元素,或者人為的給非焦點元素加上tabindex=0 來實現)
2 彈出層關閉后,一定要將焦點重新還給觸發彈出層的元素,這一點非常關鍵。
關于這個問題的一個場景是瀏覽微博,當你對第十條微博進行了轉發之后,很自然的應該繼續從第十一條微博開始繼續瀏覽,但是如果處理不好轉發微博的彈出層的焦點的話,就會導致tab焦點回到網頁第一個元素,那就意味著需要從頭開始,這就給使用鍵盤操作的用戶帶來非常差的體驗。
新浪微博和騰訊微博之前都有這一問題,經過多次反饋和交涉之后,他們的部分頁面已經解決,但仍然不夠完美。大家如果有興趣,可以在新浪微博的搜索頁面,嘗試轉發一條微博,之后在觀察tab的焦點位置。另外解釋下,讀屏軟件一般都會主動讀出焦點內容,網頁里只要調用focus(),讀屏就會讀出被focus到的元素內容。

TA貢獻1864條經驗 獲得超6個贊
解答你的問題
1. 正常情況下,只有表單元素與鏈接才能使用focus與blur事件,但是如果對元素設置了tabindex,那么其他元素也可以獲取到焦點。如果tabindex值為0到32767,則按照tabindex大小和元素順序控制按tab時的焦點轉移順序,如果tabindex值為負,則不響應tab鍵,但是元素可以被focus到。
2. 既然上個問題解決了,那么其實重新定位回去理論上也還是可以解決的,記下上次點擊所在的元素即可。
添加回答
舉報