NVDA未正确通告aria-live区域
NVDA未正确通告aria-live区域
基础概念
NVDA（NonVisual Desktop Access）是一款开源的屏幕阅读器，专为视障用户设计。它能够将屏幕上的内容转换为语音或盲文，帮助视障用户操作计算机。aria-live是HTML5中的一个属性，用于指示页面上的某些区域应该被屏幕阅读器实时更新和通告。
相关优势
- 实时更新：
aria-live区域的内容变化时，屏幕阅读器会立即通告用户，确保信息的及时传递。 - 提高可访问性：通过使用
aria-live，开发者可以显著提高网页的可访问性，特别是对于视障用户。
类型
aria-live属性有三个值：
off：默认值，表示该区域不会被屏幕阅读器通告。polite：表示屏幕阅读器会在用户不忙的时候通告该区域的变化。assertive：表示屏幕阅读器会立即通告该区域的变化，打断用户当前的阅读。
应用场景
- 实时通知：如聊天应用中的新消息提示。
- 动态更新：如股票价格、天气预报等实时数据更新。
- 表单验证：实时反馈表单输入的验证结果。
问题原因及解决方法
NVDA未正确通告aria-live区域可能有以下几种原因：
- 属性设置错误：确保
aria-live属性正确设置为polite或assertive。 - 属性设置错误：确保
aria-live属性正确设置为polite或assertive。 - 内容变化检测：确保内容变化能够被正确检测到。例如，使用JavaScript动态更新内容时，需要确保DOM元素的实际内容发生了变化。
- 内容变化检测：确保内容变化能够被正确检测到。例如，使用JavaScript动态更新内容时，需要确保DOM元素的实际内容发生了变化。
- NVDA版本问题：确保NVDA是最新版本，旧版本可能存在一些未修复的bug。
- 下载最新版本的NVDA：NVDA下载页面
- CSS样式影响：某些CSS样式可能会影响屏幕阅读器的识别，例如
display: none或visibility: hidden。 - CSS样式影响：某些CSS样式可能会影响屏幕阅读器的识别，例如
display: none或visibility: hidden。 - JavaScript错误：确保页面上没有JavaScript错误，这些错误可能会阻止
aria-live区域的正常工作。- 使用浏览器的开发者工具检查控制台中的错误信息。
示例代码
以下是一个简单的示例，展示如何正确使用aria-live属性：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aria-Live Example</title>
</head>
<body>
<div aria-live="polite" id="live-region">等待更新...</div>
<button onclick="updateLiveRegion()">更新内容</button>
<script>
function updateLiveRegion() {
document.getElementById('live-region').textContent = '新的内容已更新';
}
</script>
</body>
</html>参考链接
通过以上方法，应该能够解决NVDA未正确通告aria-live区域的问题。如果问题仍然存在，建议查看NVDA的官方文档或社区论坛，获取更多帮助。
相关·内容
1回答
我正在开发一个尽可能容易访问的React应用程序。然而，我注意到NVDA的一些奇怪的行为-我有两个活动区域，我只是不能让NVDA正确地宣布。在画外音上，所有的工作都很顺利。 首先是一个通知组件，它生成的HTML如下所示。NVDA不会宣布通知，Voiceover会： <div aria-live="polite" aria-hidden="true/false">
<article> <-- There might be many of these if there's multiple notifications, a
浏览 30提问于2020-07-23得票数 0
我有一个要求，NVDA屏幕阅读器应该读取错误信息(动态显示)在lwc上。我有一个包含错误消息列表的数组，并用来显示它们。但是，NVDA语音查看器从不读取这些消息。我试着添加aria-隐藏=“true”、aria-live=“断言”和role=“警告”以及aria-原子=“true”来标记，但它们都不起作用。找不到问题，有人能帮忙吗？以下是代码：
<ul aria-live="assertive">
<template for:each={Errors} for:item="err">
浏览 3提问于2020-08-27得票数 1
回答已采纳
1回答
NVDA的行为
、、、、
我正试图在网页中添加活动区域支持，以使NVDA与该页面一起使用。但是，我看到了aria-live属性与预期完全不同的行为。
我尝试添加一个隐藏的活动区域，并将所有消息(包含在<p>标记中的每条消息)转储到该区域，由屏幕阅读器读取。它工作良好，但唯一的问题是插入到活动区域div的第一条消息永远不会被NVDA屏幕阅读器读取。随后的消息将被完美地读取。当第一条消息被宣布时，动态地创建这个活动区域div。
aria-live="assertive"并没有真正中断当前流来宣布消息。
我正在使用淘汰赛在网页上。当HTML div被标记为活动区域时，根据敲除条件显示时
浏览 2提问于2017-01-13得票数 0
如果加载的内容有表单控件，比如单选按钮或复选框，那么aria-live="polite"将面临一个奇怪的问题。
NVDA只读取单选按钮的文本，但不宣布选择或选中哪个按钮。
<a aria-label="Click Me" href="#">Click Me</a>
<div id="myForm" aria-live="polite"></div>
这是。
浏览 2提问于2016-02-18得票数 1
我使用多个咏叹调-活标签在一个网页上，当一个错误显示在网页上，NVDA只读取第一个错误信息，而不是全部。我有用户咏叹调下面是我的代码：
<div>
<input type="text" name="username" tabIndex="0"/>
<span class="usernameerr" role="alert" aria-live="assertive">Enter User Name</span>
浏览 0提问于2018-05-07得票数 0
1回答
这里我有一个组件，它动态地改变它的数据。我们需要同时支持JAWS和NVDA。
当我从父组件更新道具时，相关的组件会得到更新，所有的东西对正常用户都很好。但是，当使用两个屏幕阅读器时，NVDA不会选择更改。
组件内部的几个方法。
render() {
console.log("render");
var alertForPrevButton = document.querySelector('#readDesc');
if (alertForPrevButton !== null) {
alertForPrevButton.tex
浏览 4提问于2018-01-04得票数 1
1回答
我希望有一个fieldset-tag来显示错误消息。
当做像这样的事情时：
<fieldset>
<legend>Some Legend</legend>
<div role="alert" aria-live="assertive" aria-relevant="all">
My Error Message
</div>
...
<!-- formfields -->
</fieldset>
屏幕阅读器没有读取错误消息，但是当将错误
浏览 2提问于2019-02-19得票数 0
我似乎找不到任何资源或代码示例可以让屏幕阅读器在将html插入dom或将html附加到dom时使用jquery (使用wai aria)。
有没有人可以告诉我一些有用的资源，我可以用来作为指导，或者提供一些代码示例，我可以使用它们来开发我的应用程序，以满足可访问性标准，并通过ajax回发将动态内容添加到我的页面中？
蒂娅。
编辑(添加了未被NVDA读取的代码)...what是否丢失？
<html>
<head>
<script language="javascript" type="text/javascript">
浏览 6提问于2012-03-23得票数 8
回答已采纳
我有一个role="alert"上的咏叹调-活区，它的值"assertive"在表单提交时没有被说出来。它也是由PHP编写的，这就像页面加载一样。
它在一台PC上的NVDA上工作得很好，但在Mac上却什么都说不出来。我发誓我以前测试过这个，并且经常使用这个技术。
你知道为什么没人说出来吗？
div看起来如下：
<div class="alert alert-danger" role="alert" aria-live="assertive">Error: please fix the indicated
浏览 4提问于2017-08-22得票数 2
回答已采纳
有人能详细解释一下aria-live="assertive"和aria-live="polite"之间的区别吗
根据我的理解，aria-live="assertive"将获得更高的优先级并清除队列，而aria-live="polite"的优先级比aria-live="assertive"低，并将继续使用队列。
浏览 1提问于2014-12-18得票数 48
回答已采纳
1回答
我正在使用html textarea来模拟命令提示符。在键入命令命令(例如ipconfig)并按Enter键时，命令输出将附加到文本之后。为了读取输出，我将aria-live="polite“属性添加到了textarea，它可以很好地使用NVDA屏幕阅读器。但是，每次输入命令时，IE上的JAWS都会从顶部开始读取。我如何让它像NVDA那样只读新追加的文本？
到目前为止，我已经尝试了aria-relevant="additions"，role=log，role=alert属性，但似乎都不起作用。
enter code here
<textarea id="c
浏览 7提问于2017-09-01得票数 0
在我的react应用程序中，我注意到了NVDA中的一个问题，其中我在aria-live元素中添加的内容被多次读出。我只注意到react中的这个问题，并且不能在普通的JavaScript中重现它。
我把我的代码分解成最小的可复制项目。使用Firefox59.0.3中的NVDA 2018.1，您可以看到NVDA读取更改6次，每个变量一次。
当您按go时，预期的行为是它应该读取新计数器一次。然而，它被读出了6次。如果您更改了${this.state.counter}变量的数量，您将看到它被读取的次数是更改的。
还有其他人遇到过这个问题吗？如果是的话，你是如何解决这个问题的？
===========
浏览 0提问于2018-05-08得票数 3
回答已采纳
我已经在HTML5中创建了一个聊天，并且我在HTML代码中包含了WAI-ARIA角色和属性，以便将新消息通知给屏幕阅读器用户。接下来，我展示了我拥有的代码：
<ul id="conversation" class="conversation" aria-relevant="all" role="log" aria-live="polite">
<li role="listitem">One element</li>
<li role="lis
浏览 0提问于2014-06-01得票数 0
1回答
Aria活页和角页
、、、
我正在尝试在一个角页上实现咏叹调的实时功能。请在下面找到我正在实现的示例代码。
/* highlights JSON data, it updates in every 30 second timeinterval */
/* issues : always read from 0 index to last item */
<ul aria-live="polite" aria-atomic="false" aria-relevant="additions">
<li class="matchday-blogs&
浏览 4提问于2017-09-02得票数 2
我正致力于让视障人士可以通过屏幕阅读器访问一个动态的web应用程序，我遇到了一个恼人的problem.When，我用NVDA Reader进行了测试。它不能读取动态添加的内容。 代码如下： <div id="section" aria-live="polite" role="alert">
<div id="floatDiv">
Some Data here
</div>
<div id="choices">
浏览 31提问于2020-03-24得票数 0
1回答
我们期望屏幕阅读器在节点关闭后宣布“一个项目已关闭”。有趣的是，Chrome上的NVDA发布了正确的消息，而安卓和iOS Voice却没有宣布这一消息。
下面是打字本代码：
@HostListener('keydown.tab', ['$event'])
removeFilterMsg() {
const $message = document.createElement('span');
$message.classList.add('RemoveFilter');
$message.setAttribu
浏览 1提问于2021-10-29得票数 1
回答已采纳
在我们的网站中，有一个div元素，它的角色是"dialog“，还有一个aria-label属性。
它适用于以下组合：
Voice Over + Google Chrome / Mozilla Firefox / Safari
NVDA + Google Chrome / Mozilla Firefox / Internet Explorer
但是，当我们使用以下命令时，它会被完全忽略：
NVDA + Microsoft Edge(*)
(*)它实际上可以在旧版本的Edge (38)上运行，但不能在最新版本: 42上运行。
这是元素：
<div role="dialog&#
浏览 0提问于2018-07-19得票数 1
我是新来的。当我按下选项卡或左/右箭头屏幕阅读器，NVDA读数为可点击，但当我是鼠标在上面，它是正确阅读。我用的是角7
模板：
<span role=“警告”aria-live=“断言”咏叹调-标记器=“图表”-关闭“id="close_svg”style=“宽度:25 4px；高度:31 4px；边缘-顶部：-6%；填充-右:4px；填充：#ffffff；笔画：#ffffff；笔画-宽度: 0.1rem；显示:内联-块；“tabindex="0”(单击)=“CloseChat()”placement=“placement=”底部“ngbTooltip="Clo
浏览 0提问于2021-08-11得票数 0
回答已采纳
1回答
下拉列表和唱段live？
、、、
当使用aria live加载时，NVDA是否有可能只读取下拉选择值？
<div aria-live="polite">
<select>
<option>A</option>
<option selected>B</option>
<option>C</option>
<option></option>
</select>
</div>
现在在firefox上，它会显示为A，B，C，但不知道选择了哪一个。当有很多选项时，这就成为一个问题
浏览 2提问于2015-06-25得票数 0
考虑到以下非常简单的场景，我不确定是否尊重不同aria属性的所有相互依赖关系:切换某个区域可见性的按钮，但该区域也必须被初始化填充。
在第一次单击之前：
<div aria-live="polite">
<button>Toggle details</button>
</div>
第一次单击后，当数据正在加载时：
<div aria-live="polite" aria-busy="true">
<button aria-controls="details&
浏览 1提问于2017-05-04得票数 1
回答已采纳
1回答
我正在努力使我的单页HTML5应用程序更加屏幕阅读器友好。应用程序的基本结构包括静态标题栏和导航菜单，以及显示大量动态变化的“页面”数据的“主”div元素。
目前，我已经将aria-live="assertive"属性添加到主div中，以便当用户触发更改页面内容的事件时，屏幕阅读器将停止读取旧内容并开始读取新内容。
有些“页面”大量使用可视化数据(图表、图表、表格)，因此为了更有效地将数据传递给屏幕阅读器，我使用了隐藏视觉元素的模式，而不是通过非屏幕文本传递信息。
当我打开浏览器并直接导航到这些元素所显示的状态时，这就很好了。但是，如果我从应用程序的其他地方开始并导航到该内容，
浏览 2提问于2014-06-24得票数 3
2回答
屏幕阅读器aria断言文本被中断
、、、、
$('#firstButton').focus();
<div id="liveRegion" aria-live="assertive">
This is a very long text
</div>
<button id="firstButton">First Button</button>
我在可访问性问题上是个新手。我基本上有一个按钮，我希望将焦点放在页面加载上，但我也希望liveRegion中的屏幕阅读器能够拾取一个文本。现在，文本将在页面加载过程中的某个时刻
浏览 0提问于2018-08-02得票数 1
1回答
用例:当礼品卡被应用时，NVDA应该读出所有错误场景的错误信息，比如“卡片已被赎回”或“验证卡时发生的错误”等。
问题:在应用code='alert'之后，错误信息会被读出，但是NVDA会部分地发出错误信息一次。请参阅下面的演讲查看器片段，以了解确切的行为：
确认卡购物车/页标题可点击主地标验证卡时警告错误
代码片段:在JS文件中添加了element.parent().after(error).attr("role","alert");。
有谁能帮我理解一下NVDA在Chrome、Firefox和Edge浏览器中的部分调用是为什么和从何而
浏览 17提问于2022-08-29得票数 0
要立即宣布控制/输入错误，我有两个选择：
将HTMLElement附加到带有角色“警报”和错误消息的文档中。NVDA读取alert. [errorMessageHere]
const el = document.createElement('div');
el.setAttribute('role', 'alert');
el.className = 'visually-hidden';
el.textContent = 'Some message here';
document.body.append(el)
浏览 6提问于2022-07-08得票数 0
回答已采纳
1回答
我有这段HTML，它是用JS动态更新的。屏幕阅读器只在更新新值时才会读出它们。它没有说明被更新的输入的标签。
<ul class="points-transfer-detail-points-calculation clearfix">
<li>
<label for="points-to-transfer">{{{ pointsToTransferLabel }}}</label>
<input id="points-to-transfer" type
浏览 3提问于2016-05-12得票数 2
回答已采纳
2回答
我对网页的可访问性是个新手。我有一个应用程序，它的主体内容会根据ajax调用中的标题链接单击进行更改，而无需刷新页面。因此，每次使用不同的页面内容(表+按钮+信息文本)单击链接时，主体中的HTML内容都会更新。
这里我的要求是，每次加载页面时，屏幕阅读器都应该通知信息文本。这里的容器是所有页面的body (或者body中的一个直接div )。因此，我将其设置为aria-live="polite"，但是每次页面加载时，它都会通告整个页面内容，但我想让它只通告信息文本。页面的其他元素应该在焦点/访问中公布。我希望我可以对所有其他元素应用aria-live="off“，但我正
浏览 1提问于2020-09-14得票数 2
是否有一种方法可以强制两个aria-live="assertive"区域被读取到完成？只要它们都被读完，它们的顺序就不重要了。
我有一个简单的表单，其中提交按钮有aria-live="assertive" (由于复杂的原因，这是不能更改的)。当提交表单时出现错误时，我也有一条错误消息。
现在，即使添加了aria-live="assertive"，也不会读取错误消息，因为辅助技术只是读取按钮消息，然后刷新队列。
浏览 9提问于2022-02-05得票数 2
回答已采纳
1回答
我有一个基于搜索标准的3种不同的div动态加载。我添加的每个div都添加了“角色=‘警报’”、"tabindex='0'“和”aria=‘礼貌’“。我注意到DOM立即加载所有3 div，但NVDA扬声器只读取最后加载的div内容。我已经在NVDA语音查看器中验证了所有显示在这里的3 div内容，但是在阅读时，它是说最后的内容。
一旦我点击按钮。NVDA逐行通话所有内容。
我使用的是角5。请查找下面的代码以获得更多信息。
HTML模板：
<input type="button" value="Click Me" tabindex=&#
浏览 5提问于2021-08-31得票数 0
回答已采纳
我收到一条错误消息，我在其中使用aria-live = polite。第一次出现错误的时候就宣布了。第二次，它再次宣布，如果我在同一页上打开弹出窗口，并且该页中发生了错误。
<div aria-live="polite">
<error-message-component></error-message-component>
</div>
我找不到为什么会发生这种情况，因为它已经向用户宣布了，弹出窗口后面的内容有aria-hidden="true“
浏览 0提问于2019-02-18得票数 1
2回答
发行：
我们正在从对话框中的一个按钮触发一个snackbar，并且没有读取snackbar。当从对话框外部的按钮触发时，它读起来很好。
期望行为：
当用户从对话框中单击“”按钮时，屏幕阅读器将读取snackbar。
代码箱：
复制问题的步骤：
注意:如果您想看看屏幕阅读器应该如何读取snackbar，请单击第一个“打开SNACKBAR”按钮。
Click 打开NVDA屏幕阅读器或JAWS屏幕阅读器转到“打开对话框”按钮单击"OPEN“按钮
测试详细信息：
<>按钮触发器: JAWS + Chrome = PASSButton触发器: JAWS += PASSButton触
浏览 2提问于2021-10-22得票数 1
1回答
我有三个Jquery对话框，其中两个可以工作，因为一旦它们打开，屏幕阅读器就会在它完成前一句话后阅读它。但是，第三个surveyDialog只有在读取屏幕上的其他所有内容后才会在最后读取。
HTML
<div class="body-content" style="padding: 4px 0">
<a id="main_content" tabindex="-1" name="main_content"></a>
<!-- <h1&
浏览 9提问于2018-03-27得票数 0
2回答
如果我在一个页面上有3个按钮，并选择其中一个会导致它们被隐藏，然后显示另一个div包含一些表单元素，我想正确地通知添加的新内容。我的理解是动态的内容变化，例如显示一个区域需要以WCAG的方式正确处理。是否有一种标准的方法可以用aria/html来处理这个问题？
我已经在新区域的外部div上尝试了aria，因为在这个场景中经常有人建议它，但是即使使用aria-live="polite"，我也会受到不良的副作用。假设显示的区域包含一个小形式。当焦点移到文本字段，并且开始键入时，我得到了一种奇怪的行为，当用户在输入中键入字符时，JAWS就会一次又一次地开始读取标签。如果我删除父div
浏览 3提问于2019-11-05得票数 1
回答已采纳
有没有办法防止“aria-live”元素被屏幕阅读器聚焦？
我正在开发一个日历，并想通知用户，无论何时当前选择的月份发生了变化。
浏览 2提问于2018-09-27得票数 1
我目前正在使用select2.jsVersion4.0，在这个问题上，屏幕阅读器(NVDA)无法读取所选选项，甚至可以将aria- selected ="true“正确添加到当前选定的li中。当我进入未选择的选项时，它读为“德语而不是选定的”，这是正确的。我也尝试使用4.1版本，但仍然有相同的问题。我在想，在select2.js中，aria selected=“true”是否有问题？真的找不到一个明确的问题。谢谢你的帮助。
这是应用select2后的选择选项，
这是打开后的风景
浏览 2提问于2022-03-14得票数 1
此应用程序发布自己的地址，以供其他系统使用.net remoting连接。它获取计算机的所有地址，如下所示：
IPAddress[] IPList = Dns.GetHostEntry(Environment.MachineName).AddressList;
string ipAddress = IPList[ipIndex].ToString();
if(ipAddress.contains(":"))
{
// ip6 address
url = "tcp://[" + ipAddress + "]:" + port + "
浏览 0提问于2011-06-06得票数 1
回答已采纳
屏幕上的控件如上图所示。中间有个柜台。当用户单击+号时，计数器增加1，减去1。我想让屏幕阅读器在用户单击+/-号时显示“计数器增加(或减少)”。这是不是可以通过唱段标签实现？我认为aria-live和aria-control在这里可能很有用，但真的不知道如何实现它。请不要要求我更改跨度标签-产品是开发和测试-我们正在努力使其与ADA兼容。我们使用NVDA进行测试。
<div class="segment">
<span class="counterDec" data-ng-click="decreaseCounter(
浏览 0提问于2018-02-13得票数 1
2回答
我有一个名为angular的组件，我正在使用aria-live，如下所示。
<div aria-live="polite">
<error-component></error-component>
</div>
此错误显示在输入字段之外的焦点上。现在，当第一次出现错误时，屏幕阅读器会读取错误。现在，我将焦点转回到输入字段，并且不做任何更改就模糊出了字段。因此，屏幕阅读器这次不会读出相同的错误。我尝试使用与aria相关的方法，但没有解决问题。我的另一个问题是假设用户输入了正确的值，然后删除了错误。屏幕阅读器是否应该告诉用户某个特定的
浏览 0提问于2018-11-06得票数 1
2回答
阅读咏叹调的标签-活区
、、、、
我有一个定义列表，其中一个项可以更改：
// Update dynamic content
setInterval(function() {
document.getElementById('dynamic-info').textContent++;
}, 3000);
<dl>
<dt>Static information</dt>
<dd>Value 1</dd>
<dt>Static information 2</dt>
<dd>Value 2&l
浏览 2提问于2016-06-09得票数 1
回答已采纳
1回答
屏幕阅读器不读取切换验证
、、、
目前，我正在研究应用程序的可访问性，并且当下面的无效条目发出警告时，屏幕阅读器(JAWS 16)会出现问题。
<span class="input-group-addon">
<span class="fa fa-exclamation fa-fw" role="alert" aria-invalid="true" aria-live="assertive"></span>
</span>
切换到有效。
<span class="input-gr
浏览 2提问于2015-10-08得票数 1
回答已采纳
2回答
我有：
<div aria-live="polite" id="signInIdError"
*ngIf="!signInId.valid && (signInId.touched || isSubmitted)"
class="inline-validation critical">
<p>{{ "FYPVERROR" | translate }}</p>
</div>
问题是，当错误在字段验证中动态显示时，错误被不间断地读取，而不
浏览 2提问于2017-08-02得票数 0
回答已采纳
我有一些问题的IE 11和大白鲨。请看下面的例子。
简化代码示例：
<input type="text" />
<span role="alert" aria-live="assertive" id="err"></span>
<select id="colours">
<option value="White">White invalid</option>
<option value="Green"
浏览 1提问于2016-09-28得票数 0
2回答
当您在我的应用程序中搜索某些内容时，我有一些动态文本"n结果发现“。关于这个元素，我有aria-atomic="true"和aria-live="assertive"，如下所示：
<p aria-atomic="true" aria-live="assertive">n results found</p>
在Mac的画外音中，这条信息是正确的，没有任何问题。但是在带有JAWS软件的Windows上，消息并没有被发出。我注意到，如果我使用快捷方式"Insert+Z“关闭虚拟游标，aria-li
浏览 4提问于2020-05-27得票数 1
回答已采纳
我在我的网站上有一个动态更新的通知部分，我的div class=‘notification’(父div总是在那里)。当成功消息出现时，Windows10边缘中的NVDA屏幕阅读器不会读取它。我怎么才能让它读消息呢？ <div class="notification">
<h6 tabindex="0" role="alert" aria-live="polite" aria-busy="true">Changes saved successfully.</h6>
浏览 15提问于2020-05-02得票数 0
如何在Android上找到接收到BLE信标的频道？它是否包含在ScanRecord字节数组中？
浏览 1提问于2015-05-22得票数 0
我们有一个带有多个依赖下拉列表的模态对话框，选择一个下拉列表中的值将动态地重新填充该依赖下拉列表。
由于这种行为，每当重新填充任何下拉选项时，JAWS都会再次读取所有字段。
示例，虚拟标记
<div role="dialog">
<div>
<select id = "one">
<option value="0">A</option>
<option value="1">B</option>
浏览 2提问于2015-03-11得票数 1
我在page ARIA-LIVE上有这样的块： <div
aria-live='polite'
role='log'
aria-relevant='additions'
aria-atomic='false'
style='position: absolute; width: 1px; height: 1px; margin-top: -1px; clip: rect(1px, 1px, 1px, 1px); overflow: hidden;'>
<div>mes
浏览 20提问于2019-03-07得票数 1
回答已采纳
aria-实时屏幕阅读器的阅读顺序不正确
Example:
<div id="one" aria-live="polite">TEST 1</div>
<div id="two" aria-live="polite">TEST 2</div>
<div id="three" aria-live="polite">TEST 3</div>
屏幕阅读器类似于：“TEST 2 TEST 1 TEST 3”它是随机读
浏览 19提问于2020-02-17得票数 1
1回答
当在我的站点上发生不同的事件时，我试图获得一个vue组件来动态地向屏幕阅读器宣布信息。
我让它工作，点击一个按钮将填充一个跨度，即aria-live="assertive"和role="alert"的文本。这是第一次正常工作，但是，单击其他具有类似行为的按钮会导致NVDA在读取新文本之前读取之前的文本两次。这似乎发生在vue中，但与使用jquery的类似设置无关，因此我猜这与vue呈现给DOM的方式有关。
我希望有一些方法来解决这个问题，或者更好地将文本读给没有这个问题的用户。任何帮助都是非常感谢的。
我在一个工作代码沙箱中设置了，以显示我遇到的问题(导航到co
浏览 0提问于2018-06-11得票数 10
回答已采纳
我一直在到处寻找这个问题的最佳解决方案，但我没有找到任何好的解决方案。我希望像NVDA或JAWS这样的屏幕阅读器在加载时宣布新页面。但在使用箭头键滚动页面时，它不会检测到此消息。 我试过很多东西。 例如，我添加了一个role=为“alert”和/或aria-live="polite“的span元素，并使用CSS将其隐藏，并动态地将innerHtml添加到该元素中以供屏幕阅读器通知。但屏幕阅读器会在使用箭头键滚动页面时检测到它，并再次读取消息。因此，设置一个超时函数，该函数将在2秒后将innerHtml设置为空。 上述方法在某些浏览器中运行良好，但在IE浏览器和JAWS中，它会读取两次
浏览 10提问于2020-08-12得票数 0
回答已采纳
1回答
我正在创建一个包含验证错误的from，显示在相关输入下面。为了使表单更容易访问，我在div中添加了aria，它将保存错误消息。如果有一个以上的咏叹调-直播，这会使用户更糟吗？
<div
id="awesome-id">
<label for="awesome-id--input">
This is a label
</label>
<input
type="tel"
id="awesome-id--input"
浏览 1提问于2019-07-18得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
