如何使屏幕阅读器专注于消息

我正在使用屏幕阅读器的咏叹调。我如何使屏幕阅读器专注于以下错误？我添加了role ="error" tabindex="-1"，但在出现错误时不重点关注。如何使屏幕阅读器专注于消息

<div role ="error" tabindex="-1" ng-class="{ 'alert': flash, 'alert-success': flash.type === 'success', 'alert-danger': flash.type === 'error' }" ng-if="flash" ng-bind="flash.message" style="text-align:left;" class="ng-binding ng-scope alert alert-success">Item has been added to Shopiing cart</div>

来源

2016-04-27 user244394

标签[tag：ada]是关于编程语言Ada的。我很确定你的意思是美国残疾人法案。 –

@SimonWright - 是的，对于美国残疾..我需要能够集中在一个div或p标签内的错误信息等 – user244394

这里没有很多上下文，但我想知道你是否真的需要设置焦点。

如果您确实需要关注它，则只能使用JavaScript .focus（）。添加到它的tabindex将意味着设置焦点时仍保持Tab键顺序。

但是，它看起来像是用它作为快速警报，让用户知道是否添加了该项目。似乎并不需要实际的互动/运动。

如果使用焦点，您可能会将用户从当前位置移动到页面的全新区域。如果没有下一步他们跳到用户可能不知道下一步该怎么做。

但是，咏叹调被现代版本的屏幕阅读器所理解，并且您可以使用aria-live属性。您可以将其设置为礼貌，以便等待用户首先完成其交互。我也会改变你的角色来提醒。

该方法允许用户保持与页面的交互，但会被警告某些事情是否成功。

来源

2016-04-29 02:26:33

如何使屏幕阅读器专注于消息

回答

相关问题