Javascript 可访问性（JAWS）-带有jQuery所选库的下拉列表

这是我第一次在这里发帖，如果这个问题已经以任何方式得到解决，或者我没有遵循正确的指导原则，请接受我的道歉

我面临着一个问题，即盲人在使用JAWS屏幕阅读器时无法访问下拉列表

我在Javascript和jQuery方面的专业知识非常基础，所以我希望能得到一些帮助来解决这个问题

没有屏幕阅读器，我可以在不同的选项（上下键）之间完美移动。但是，当JAWS处于活动状态时，我无法执行此操作。当按下向下键时，虽然JAWS读取下一个选项，但这些选项不会被选中（我可以一直按下向下键，JAWS每次都会读取下一个选项，但这些选项从未被选中-在一个选项发言后点击Intro也不会选择它）

这是我的jsp中用于下拉列表的一行代码

     <form:select id="searchAnimals" path="animals" data-placeholder="${animalsPlaceHolder}" class="animalsSelect"></form:select>

jQuery选择的库格式将导致以下结果：

<select id="searchAnimals" name="animals" data-placeholder="Select an animal..." class="animalsSelect" style="display: none;">
<option value="" selected="selected"></option>
<option value="23">cat</option>
<option value="4">dog</option>
<option value="73">horse</option>
<option value="3">duck</option>
</select>
<div class="chosen-container chosen-container-single" style="width: 180px;" title="" id="searchAnimals_chosen">
<a class="chosen-single chosen-default"><span>Select an animal...</span><div><b></b></div></a>
<div class="chosen-drop">
<div class="chosen-search">
<input type="text" autocomplete="off"></div>
<ul class="chosen-results">
<li class="active-result" data-option-array-index="1">cat</li>
<li class="active-result" data-option-array-index="2">dog</li>
<li class="active-result" data-option-array-index="3">horse</li>
<li class="active-result" data-option-array-index="4">duck</li>
</ul>

猫
狗
马
鸭子
选择一种动物。。。

类别
狗
马

。。。 通常，当选择一个选项时，它会包含在所选容器中。JAWS似乎无法识别/读取这些内容，而是一直在读取未显示的HTML列表

有没有办法做到这一点？请注意，更改/修改所选库并不理想

谢谢，

---

这是自2011年以来非常普遍的问题。我也面临着这个问题，实际上花了很多时间才得到确切的答案，但最终我找到了一些东西。 您需要用原始文件替换以下文件：

基本上，添加了角色、aria标签等aria属性。 有关更多信息，请参见：

注意：请按照cooperfellows的帖子查看上述链接。

---

谢谢。

这是自2011年以来非常普遍的问题。我也面临着这个问题，实际上花了很多时间才得到确切的答案，但最终我找到了一些东西。 您需要用原始文件替换以下文件：

基本上，添加了角色、aria标签等aria属性。 有关更多信息，请参见：

注意：请按照cooperfellows的帖子查看上述链接。

---

谢谢。

您是否有我们可以测试此功能的实时页面？通常，在jQuery设置中，会有其他客户端脚本触发，而粘贴的代码在运行时环境中无法表示这些触发。您是否有一个活动页面，我们可以在其中进行测试？通常，在jQuery设置中，有其他客户端脚本触发，而粘贴的代码在运行时环境中无法表示。