0

有没有办法通过使用 aria-label 或使用 aria-labelledby 或任何其他属性来获取可见标签名称和自定义名称

例如下面的代码是说： -

<div>
    <div id="shankar">Name</div>
    <input type="text" aria-labelledby="shankar"/>
</div>
<div>
    <div id="set-address">Address</div>
    <input type="text" aria-label="set-address"/>
</div>

reader:- 1.名称编辑文本（用于第一个输入框） 2.设置地址编辑文本（用于第二个输入框）

我已经通过链接在此处输入链接描述

我应该怎么做才能得到消息： -为地址编辑文本设置地址？我应该在这里使用哪个属性？

4

1 回答 1

0

对于屏幕阅读器，并且因为您的情况是表单输入，所以正确的语法是：

<div>
    <label for="shankar">Name</label>
    <input type="text" id="shankar"/>
</div>

您必须为针对“id”属性的属性关联标签标签。

如果您在其他情况下（如下拉菜单或标签面板）：

将类似于（此处示例显示翻译的案例下拉列表）：

    // My label structure
<button id="associatedLang" role="button" title="" aria-expanded="true">
    <span class="ps-current-lang">FR</span>
    <span aria-hidden="true" class="ps-icon ps-icon-chevron-down"></span>
    <span class="sr-only">Changer de langue</span>
</button>

//MY associated content 

<ul aria-labelledby="associatedLang">
    <li class="ng-star-inserted">
        <a target="_self" href="####" lang="en" title="EN - English">
        EN
      </a>
    </li>
</ul>
于 2018-03-16T07:35:15.243 回答