2011-08-02 78 views
12

我試圖讓詠歎調生活區域與JAWS 11和IE8正常工作。詠歎調生活和JAWS

使用下面的代碼,我可以讓JAWS在按鈕被點擊時發佈新值,但行爲並不是我所期望的。

JSFiddle of this example

<!DOCTYPE html> 
<html> 
<head></head> 
<body> 
    <button onclick="document.getElementById('statusbar').innerHTML = parseInt(document.getElementById('statusbar').innerHTML) + 1">Update</button> 
    <div id="statusbar" aria-live="polite">0</div> 
</body> 
</html> 

用我JAWS11/IE8的配置,按鈕上的每一次點擊,我聽到:

 
Click number HTML Value (after click) JAWS says 
------------ ------------------------- --------- 
1    1       "Update button 0" 
2    2       "1" 
3    3       "2" 

的問題,我的問題是:如何讓我JAWS宣佈詠歎調 - 現場區域的當前值,而不是詠歎調 - 現場區域的先前值?

我也會對其他屏幕閱讀器如何處理此功能感興趣。

+0

同樣的問題似乎並不在[視頻演示詠歎調活(http://www.youtube.com/watch?v=9nZnTdSAkH0#t=3m8s)發生 - 也許這與我的具體設置有關? –

回答

12

你的代碼是正確的。顯然,「1後面」已經是discovered。從鏈接看起來好像使用aria-atomic="true"可能會解決問題。不過,的示例在IE9和Firefox中正常工作。

如果您還沒有偶然發現它們,請查看codetalksaccessibleculture.org上的測試用例。有很多細微的差異要意識到。測試失敗時不要感到驚訝!在過去的一年左右,我遇到了一些(不足)的技巧,可以幫助你。

方法1:role="alert"

alert作用supposed to be相當於aria-live="assertive",但舊版本的JAWS沒有妥善處理。

如果您正在尋找支持JAWS 10在IE7或IE8的話,那可能是最好用兩個角色加倍的警報=「警報」和詠歎調:從2011年2月,其中規定,退房these examples -live = 「自信的」。雖然這有些多餘,因爲根據定義,警報角色將作爲自信的活動區域進行處理,這樣做的確會使JAWS 10在這兩個瀏覽器中自動發佈更新警報的內容。

Firefox4 +和IE9都不需要這個。但是,如果是這樣的:

<div id="statusbar" role="alert" aria-live="assertive"> 
    Contents will be spoken when changed 
</div> 

方法2:重點迫使黑客

通過動態創建一個DOM元素,並迫使焦點,你便可以「欺騙」大多數屏幕閱讀器進入閱讀內容。這很冒險,但很有效...並且有點像Create and Focus的例子。簡體中文,你可以做這樣的事情:

<div id="statusbar" role="alert" tabindex="-1"></div> 

$('#statusbar') 
    .clear() 
    .append('<div>' + newString + '</div>') 
    .children().first().focus() 
; 

僅僅隱藏/顯示的內容,而不是實際工作相當不錯的大部分時間。然而,VoiceOver的焦點滯留在元素上,並且在再次顯示時不會說出其內容。因此,將它從DOM中移除似乎是目前最安全的方法。我不喜歡它,但這是事情的狀態。

+0

很好的答案,謝謝!使用aria-live =「polite」和role =「alert」確實可以讀取IE8和JAWS 11中的當前值(而不是之前的值),但它會讀取兩次當前值。對於

+0

@Daniel,感謝您對IE8的更新。祝你好運! –

相關問題