JAWS在使用上下按钮进行遍历时正在读取禁用的按钮内容。当我进入非禁用按钮时，它会读取该按钮的aria标签并移动到下一个按钮，但当我进入禁用按钮时它会读取其中的内容，就像svg和其他按钮一样。
<div class="ms-Stack button-container css-391"><button class="viewandsignbutton"
aria-label="View and sign Non-Disclosure Agreement" tabindex="0"><svg class="filter-white" width="14"
height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M4.375 4.375C4.375 4.45703 4.37272 4.55046 4.36816 4.65527C4.36816 4.75553 4.37956 4.85124 4.40234 4.94238C4.42513 5.02897 4.46615 5.10189 4.52539 5.16113C4.58919 5.22038 4.6849 5.25 4.8125 5.25H7V6.125H4.8125C4.63021 6.125 4.45931 6.09082 4.2998 6.02246C4.1403 5.9541 4.0013 5.86068 3.88281 5.74219C3.76432 5.6237 3.6709 5.4847 3.60254 5.3252C3.53418 5.16569 3.5 4.99479 3.5 4.8125V4.375H4.375ZM11.375 7V3.5H2.625V7H6.01562L6.89062 7.875H1.75V2.625H12.25V7.875H10.6094L9.73438 7H11.375ZM7.74512 6.25488L14 12.5029L13.3779 13.125L7.12988 6.87012L7 6.125L7.74512 6.25488ZM14 0.875V11.2656L13.125 10.3906V1.75H0.875V11.293C1.86849 11.612 2.87565 11.8512 3.89648 12.0107C4.92188 12.1702 5.95638 12.25 7 12.25C7.57878 12.25 8.15072 12.2249 8.71582 12.1748C9.28548 12.1247 9.85514 12.0518 10.4248 11.9561L10.459 12.168L10.4248 11.9561L10.8828 11.8604L11.6143 12.5986C10.8441 12.7673 10.0785 12.8971 9.31738 12.9883C8.56087 13.0794 7.78841 13.125 7 13.125C5.79232 13.125 4.60742 13.0225 3.44531 12.8174C2.28776 12.6123 1.13932 12.3138 0 11.9219V0.875H3.5V0H10.5V0.875H14Z"
fill="#171717"></path>
</svg>View and sign</button></div>
<div class="ms-Stack button-container css-391"><button class="viewandsignbutton" aria-label="xyz" tabindex="0" disabled=""><svg class="filter-white-hidden" width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.375 4.375C4.375 4.45703 4.37272 4.55046 4.36816 4.65527C4.36816 4.75553 4.37956 4.85124 4.40234 4.94238C4.42513 5.02897 4.46615 5.10189 4.52539 5.16113C4.58919 5.22038 4.6849 5.25 4.8125 5.25H7V6.125H4.8125C4.63021 6.125 4.45931 6.09082 4.2998 6.02246C4.1403 5.9541 4.0013 5.86068 3.88281 5.74219C3.76432 5.6237 3.6709 5.4847 3.60254 5.3252C3.53418 5.16569 3.5 4.99479 3.5 4.8125V4.375H4.375ZM11.375 7V3.5H2.625V7H6.01562L6.89062 7.875H1.75V2.625H12.25V7.875H10.6094L9.73438 7H11.375ZM7.74512 6.25488L14 12.5029L13.3779 13.125L7.12988 6.87012L7 6.125L7.74512 6.25488ZM14 0.875V11.2656L13.125 10.3906V1.75H0.875V11.293C1.86849 11.612 2.87565 11.8512 3.89648 12.0107C4.92188 12.1702 5.95638 12.25 7 12.25C7.57878 12.25 8.15072 12.2249 8.71582 12.1748C9.28548 12.1247 9.85514 12.0518 10.4248 11.9561L10.459 12.168L10.4248 11.9561L10.8828 11.8604L11.6143 12.5986C10.8441 12.7673 10.0785 12.8971 9.31738 12.9883C8.56087 13.0794 7.78841 13.125 7 13.125C5.79232 13.125 4.60742 13.0225 3.44531 12.8174C2.28776 12.6123 1.13932 12.3138 0 11.9219V0.875H3.5V0H10.5V0.875H14Z" fill="#171717"></path></svg>xyz and abc</button></div>
顶部按钮是非禁用按钮，它可以在钳口中获得一次焦点，而底部按钮是禁用按钮，可以获得多个焦点，其中的内容也可以获得焦点。
发生了什么
禁用的按钮并不意味着接收焦点，添加tabindex="0"可能会在某些屏幕阅读器/浏览器组合中覆盖这种行为。
另一个可能的问题是可访问性树正在获取SVG(如果您正在使用IE进行测试(。
我该怎么修
删除tabindex="0"，它不应该真的存在于<button>上，那么该网站在所有HTML5浏览器中都会像预期的那样运行。然后确保您停止SVG接收焦点。
构建HTML的更好方法
aria-label在很多情况下都很好，但仍然没有100%的覆盖率！所以我们可以用视觉上隐藏的文本来代替它。这意味着没有兼容性问题，因为它可以在任何浏览器/屏幕阅读器组合中一直工作到IE6！
另一个问题是IE中的SVG，因此我们需要确保，如果它们是用于演示，我们会对屏幕阅读器隐藏它们。
role="presentation"不一致，所以我建议使用focusable="false"(用于IE行为不端(和aria-hidden="true"，因为这只是将SVG从可访问性树中完全删除。
把这些放在一起，我建议采用类似于以下的结构：
.visually-hidden {
border: 0;
padding: 0;
margin: 0;
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px 1px 1px 1px); /* IE6, IE7 - a 0 height clip, off to the bottom right of the visible 1px box */
clip: rect(1px, 1px, 1px, 1px); /*maybe deprecated but we need to support legacy browsers */
clip-path: inset(50%); /*modern browsers, clip-path works inwards from each corner*/
white-space: nowrap; /* added line to stop words getting smushed together (as they go onto seperate lines and some screen readers do not understand line feeds as a space */
}<div class="ms-Stack button-container css-391">
<!-- remove the aria-label -->
<button class="viewandsignbutton">
<!-- focusable="false" is to stop the SVG getting focus in IE, aria-hidden is to ensure the SVG is not read as it adds no value -->
<svg focusable="false" aria-hidden="true"></svg>
<!-- in this example we are adding **ADDITIONAL** text for screen reader users so we just add visually hidden text at the end of the visible text -->
View and sign <span class="visually-hidden"> Non-Disclosure Agreement</span>
</button>
</div>
<div class="ms-Stack button-container css-391">
<!-- remove the aria-label -->
<button class="viewandsignbutton" disabled="">
<svg focusable="false" aria-hidden="true"></svg>
<!-- in this example we are adding **DIFFERENT** text for screen reader users so we hide the original text from screen readers and add visually hidden text for the screen reader -->
<span aria-hidden="true">xyz and abc</span> <span class="visually-hidden">xyz</span>
</button>
</div>添加role="演示文稿"；in svg将修复此问题。