如何为文件选择器添加wai-aria属性?

问题描述 投票:0回答:1

我目前正在遵循本教程以获得文件选择器功能。 http://www.alecjacobson.com/weblog/?p=1645

我想为“选择文件”部分添加wai-aria属性以使其可读。我试图使用咏叹调控制和tabindex,但当我模拟一些验证器时,无法得到任何积极的反应..任何想法?

<body>
    <input id="file" type="file" multiple onchange="startRead()">
    <h3>Progress:</h3>
    <div style="width:100%;height:20px;border:1px solid black;">
    <div id="bar" style="background-color:#45F;width:0px;height:20px;"></div>
    </div>
    <h3>File contents:</h3>
    <pre>
        <code id="output">
        </code>
    </pre>
</body>

javascript html html5 wai-aria filepicker
1个回答
2
投票

我想为“选择文件”部分添加wai-aria属性以使其可读

你能解释一下吗?

当使用原生html(例如<input type="file">)时,你会获得很多内置的可访问性。浏览器知道如何通过辅助功能API表示原生html元素,从而允许屏幕阅读器正确地宣告名称,角色和值。元件。所以它默认是“可读的”。

但是,如果您正在讨论进度指示器并希望在加载文件时传达文件上载的进度,则必须使用aria-live执行此操作。在Progress Bar with ARIA Live Regions上有一个很好的例子

© www.soinside.com 2019 - 2024. All rights reserved.