TA貢獻(xiàn)1811條經(jīng)驗(yàn) 獲得超5個(gè)贊
彈出層的焦點(diǎn)問題我覺得他已經(jīng)成為如今互聯(lián)網(wǎng)應(yīng)用中最典型和棘手的可用性問題之一，尤其對(duì)使用讀屏軟件的視障用戶。
具體的實(shí)現(xiàn)我沒有經(jīng)驗(yàn)，但我覺得下面幾點(diǎn)必須重視：
1 fbocus到彈出層內(nèi)的一個(gè)元素上（這可以是彈出層里的第一個(gè)可設(shè)定焦點(diǎn)元素，或者人為的給非焦點(diǎn)元素加上tabindex=0 來實(shí)現(xiàn)）
2 彈出層關(guān)閉后，一定要將焦點(diǎn)重新還給觸發(fā)彈出層的元素，這一點(diǎn)非常關(guān)鍵。
關(guān)于這個(gè)問題的一個(gè)場(chǎng)景是瀏覽微博，當(dāng)你對(duì)第十條微博進(jìn)行了轉(zhuǎn)發(fā)之后，很自然的應(yīng)該繼續(xù)從第十一條微博開始繼續(xù)瀏覽，但是如果處理不好轉(zhuǎn)發(fā)微博的彈出層的焦點(diǎn)的話，就會(huì)導(dǎo)致tab焦點(diǎn)回到網(wǎng)頁第一個(gè)元素，那就意味著需要從頭開始，這就給使用鍵盤操作的用戶帶來非常差的體驗(yàn)。
新浪微博和騰訊微博之前都有這一問題，經(jīng)過多次反饋和交涉之后，他們的部分頁面已經(jīng)解決，但仍然不夠完美。大家如果有興趣，可以在新浪微博的搜索頁面，嘗試轉(zhuǎn)發(fā)一條微博，之后在觀察tab的焦點(diǎn)位置。另外解釋下，讀屏軟件一般都會(huì)主動(dòng)讀出焦點(diǎn)內(nèi)容，網(wǎng)頁里只要調(diào)用focus()，讀屏就會(huì)讀出被focus到的元素內(nèi)容。
TA貢獻(xiàn)1864條經(jīng)驗(yàn) 獲得超6個(gè)贊
解答你的問題
1. 正常情況下，只有表單元素與鏈接才能使用focus與blur事件，但是如果對(duì)元素設(shè)置了tabindex，那么其他元素也可以獲取到焦點(diǎn)。如果tabindex值為0到32767，則按照tabindex大小和元素順序控制按tab時(shí)的焦點(diǎn)轉(zhuǎn)移順序，如果tabindex值為負(fù)，則不響應(yīng)tab鍵，但是元素可以被focus到。
2. 既然上個(gè)問題解決了，那么其實(shí)重新定位回去理論上也還是可以解決的，記下上次點(diǎn)擊所在的元素即可。
舉報(bào)