用于显示从表单输入的值的静态 DIV 的标签

Question

我有一个确认屏幕，其中先前输入的表单

input

字段显示为静态 DIV。

HTML 如下。 DIV 虽然是静态的，但可以通过 TAB 进行聚焦，从而允许用户使用键盘敲击它们。

            <div>
                <label className="itemText"> <!-- Does this need a FOR ID? -->
                    First Name
                </label>
                <div id="divFirstName" tabIndex={0}>
                    {firstName}
                </div>
            </div>

在这种情况下，是否有必要（或可能）提供

label for=..

或

aria-label

将显示的

<div>

值与

<label>

关联以实现 508 合规性，类似于实际

input

控件的操作？这种情况应该怎么办？

Answer 1

标签 - W3SCHOOLS

W3 表示“for”- 属性仅对 FORM-Elements 有效。

解决方法是仅使用 FORM-Elements。

或者使用“角色”-属性： 辅助功能角色、名称和值

我认为这可能会起作用。

Answer 2

我和

role="region"

和

aria-label="label"

一起去了：

<div role="region" aria-label="This form is being completed by" tabIndex={0}>