car*_*rke 5 html accessibility screen-readers inline-editing
我的产品有一个我们想要显示默认值的区域（比如文档页面的名称），但是当用户关注它并点击空格键时，它变成了一个可编辑的字段。我们正在尝试编写可访问的代码，我想知道是否有人指导过如何使用屏幕阅读器向某人指示此内容是可编辑的？
我们目前在代码中处理它的方式是有一个带有名称的 div，当用户点击（或聚焦并点击空格键）时，它会变成一个输入。（他们可以点击回车或按钮进行保存。）我们可以利用这个或其他一些本地解决方案的 ARIA 值吗？
默认：
<div>Page title <button>Click to edit page title</button></div>
编辑时：
<input maxlength="500" value="Page title" />
我们现在没有保存按钮。您按 Enter 键或从输入中删除焦点，它会自动更新。
HTML 文档中的 ARIA将“具有 contenteditable 属性的元素”定义为具有隐式aria-readonly="false"属性。根据 ARIA 文档，此属性仅适用于某些 ARIA 角色，并且该textbox角色更适合您的情况。在这种情况下，不需要按钮。
如果您的可编辑部分不包含 HTML 代码（如链接），那么使用部分似乎毫无用处contenteditable，您应该使用标准input或textarea具有适当 CSS 设计的元素，尊重 WCAG 标准（即可编辑字段必须与文本区分开来）
如果您的可编辑部分确实包含 HTML 代码，那么您将必须使用contenteditable属性。您必须将该部分标识为一个role=textbox元素，并且它必须可以通过tabindex=0属性获得焦点。这可以在页面加载时（不带按钮）或单击该部分外部的按钮后完成（例如，如果您需要能够在正常阅读上下文中激活内部链接）。