Tu código es correcto. Aparentemente, el "1 detrás" ha sido discovered. Desde el enlace, parece que usar aria-atomic="true"
puede solucionar el problema. Sin embargo, el ejemplo dado hace funciona correctamente en IE9 y Firefox.
Si aún no se ha encontrado con ellos, consulte los casos de prueba en codetalks y accessibleculture.org. Hay muchas diferencias sutiles para tener en cuenta. ¡No te sorprendas cuando las pruebas fallan! Durante el año pasado más o menos, me encontré con algunos trucos (inadecuados) que pueden ayudarte.
Método 1: role="alert"
El papel es alert
supposed to be equivalente a aria-live="assertive"
, pero más viejas versiones de JAWS no se manejan correctamente. Echa un vistazo a these examples de febrero de 2011, que establece que:
Si usted está mirando para apoyar JAWS 10 en IE7 o IE8 en absoluto, es probable que la mejor manera de duplicar en alerta tanto con función = "alerta" y Aria -live = "asertivo". Si bien esto es algo redundante ya que, por definición, la función de alerta debe procesarse como una región en vivo asertiva, hacerlo permite que JAWS 10 anuncie automáticamente el contenido de la alerta actualizada en esos dos navegadores.
Tanto Firefox4 + como IE9 no requieren esto. Sin embargo, sería algo como esto:
<div id="statusbar" role="alert" aria-live="assertive">
Contents will be spoken when changed
</div>
Método 2: centrarse obligando a cortar
Al crear dinámicamente un elemento DOM y forzando el foco a ella, puede "engañar" a la mayoría de los lectores de pantalla en la lectura de la contenido. Es hackish, pero efectivo ... y de alguna manera el punto del ejemplo Create and Focus. Simplificada, se puede hacer algo como esto:
<div id="statusbar" role="alert" tabindex="-1"></div>
$('#statusbar')
.clear()
.append('<div>' + newString + '</div>')
.children().first().focus()
;
Simplemente ocultar/mostrar el contenido en lugar realmente funciona bastante bien la mayor parte del tiempo. Sin embargo, el foco de VoiceOver permanece en el elemento y no dice su contenido cuando se muestra de nuevo. Por lo tanto, eliminarlo del DOM parece ser el método más infalible por el momento.No me gusta, pero tal es el estado de las cosas.
El mismo problema no parece ocurrir en [este video que demuestra aria-live] (http://www.youtube.com/watch?v=9nZnTdSAkH0#t=3m8s) - quizá ¿Tiene algo que ver con mi configuración específica? –