簡體   English   中英

區分鼠標“單擊”和屏幕閱讀器“按”

[英]Differentiate between mouse “click” and screen reader “Press”

我正在制作一個可訪問的網站菜單,並希望區分鼠標“單擊”和VoiceOver“按”以打開子菜單。 當我console.log事件時,鼠標事件是在VoiceOver“按”而不是鍵盤事件上觸發的。

有沒有辦法分辨出差異?

當前,該菜單基於鼠標懸停,並且我阻止了Click事件切換子菜單。 但是,我希望只有鍵盤的用戶能夠使用屏幕閱讀器打開子菜單,該屏幕閱讀器指示用戶使用命令+選項+空格鍵進行PRESS,從而觸發鼠標事件“單擊”。

我現在正在研究的一種解決方案是僅在懸停處於活動狀態時才禁用點擊事件...

更新:

目標:為可以看到並鏈接到顯示無法打開的人的超級菜單鏈接的頁面的用戶觸發超級菜單彈出窗口。 根據我的研究,即使菜單編碼精美,對於視覺障礙者來說也是一種痛苦。 即使aria可以告知菜單項是可擴展的,也無法識別菜單已擴展,這似乎並沒有在擴展時通知。 我認為對於用戶來說,導航到新頁面並跳至大型菜單鏈接的內容會是更好的體驗。

解決方案:通過使用事件偵聽器集合,我能夠成功且獨立地定位鍵盤ENTER單擊VoiceOver / screenreader單擊和鼠標單擊。

在將鼠標移到菜單項上時,我設置了preventClick標志,在鼠標移開時,我刪除了該標志,以便單擊菜單項時不跟隨鏈接,而僅打開子菜單。

在按下鍵盤時,我檢查是否按下了“輸入”鍵。 如果是這樣,我將顯示該子菜單,並阻止該鏈接被跟隨,以便用戶和制表符瀏覽大型菜單項。

屏幕閱讀器僅需單擊以跟隨指向專門顯示超級子菜單頁面的鏈接。

另外,對於屏幕閱讀器,我可以打開子菜單並將鍵盤焦點發送到子菜單的第一個元素。 不知道這對於用戶而言是否更直觀。

評論:如果您認為此解決方案有問題,請告訴我。 到目前為止,效果很好。 假設人們的運動控制問題和良好的視力使用tab + enter進行導航,而視障人士則使用其屏幕閱讀器單擊等效項。 VoiceOvers Command + Option +空格鍵。

您將從此博客文章中注意到,不可能天真地區分鼠標用戶和屏幕閱讀器用戶

http://unobfuscated.blogspot.com/2013/05/event-handlers-and-screen-readers.html

即使可能,嘗試這樣做也被視為侵犯隱私,因為這等於用戶將自己標識為已禁用。 應該沒有任何理由要這樣做-您的用例是什么?

更新

您的解決方案將可以在除不存在懸停功能的觸摸設備之外的所有地方使用,但是,話雖這么說,您會遇到很多麻煩。 只要您在語義上標記了大型菜單,盲人用戶就可以毫無問題地瀏覽它。

請訪問https://www.capitalone.com/ ,以獲取可合理訪問的大型菜單實施。

最好的選擇是覆蓋菜單項上的accessibilityPerformAction,處理NSAccessibilityPressAction,然后傳遞給super的實現以照常處理事情,而無需覆蓋任何內容。 我還沒有嘗試過,但是我認為它很有可能工作。 關鍵是accessibilityPerformAction由VoiceOver調用(更具體地講,是應VoiceOver的要求由AppKit的輔助功能支持)調用的,因此您可以通過這種方式知道某些輔助技術(例如VoiceOver)要求打開菜單,而不是鼠標。

出於好奇,我仍然想知道為什么要區分這兩種情況,您希望實現什么不同的行為。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM