如何使用按钮无障碍地将小程序注入页面？
How to accessibly inject an applet onto a page using a button?
在 HTML 页面中，我有一个 <button>。单击它，javascript 会将小程序注入到页面其他位置的 <div> 中。再次单击它会隐藏 div。更多点击切换它。 （如果重要，它是 GeoGebra applet。）
我对如何轻松地做这种事情有一些疑问。我希望这里的无障碍专家可能会给出答案。
- 我的按钮有一个标题 "Show calculator"，按下时切换到 "Hide calculator"。按钮属性还有什么关系吗？
- 将小程序注入到
<div> 中而不是 HTML <object> 中是否正确？
- 按下按钮时，焦点可以留在按钮上还是应该移至小程序？如果焦点停留在按钮上，我是否需要为屏幕 reader 用户提供一些简单的方法来跳转到小程序？如果是这样，如何以这种方式与用户沟通？我是否应该提供一种简单的方法将焦点从小程序返回到按钮？
- 这种东西，
<div>上应该有aria属性吗？有合适的咏叹调角色吗？在这种情况下使用 aria live region 宣布 div 的 showing/hiding 是否合适？
为了获得最佳的无障碍体验，您应该遵循 disclosure widget pattern。
回答您的具体问题。
- 披露模式讨论了应该在您的按钮上设置的 ARIA 属性。
- 抱歉，这与辅助功能无关，所以我无法回答。
- 一般情况下，选择按钮后不应移动焦点。如果这样做，它可能会违反 WCAG 3.2.2 On Input、“除非用户在使用该组件之前已被告知该行为”。
As至于让用户知道如何访问小程序，如果您遵循披露小部件模式，当您更改 aria-expanded 的值时，他们会听到“展开”或“折叠”，这样用户就会知道接下来会发生什么.您的小程序是否紧跟在 DOM 中的按钮之后？那将是最好的解决方案。如果按钮和新注入的小程序之间有元素，那可能会造成混淆。
aria-live 可能非常方便，但在这种情况下，如果遵循#3，则没有必要。
在 HTML 页面中，我有一个 <button>。单击它，javascript 会将小程序注入到页面其他位置的 <div> 中。再次单击它会隐藏 div。更多点击切换它。 （如果重要，它是 GeoGebra applet。）
我对如何轻松地做这种事情有一些疑问。我希望这里的无障碍专家可能会给出答案。
- 我的按钮有一个标题 "Show calculator"，按下时切换到 "Hide calculator"。按钮属性还有什么关系吗？
- 将小程序注入到
<div>中而不是 HTML<object>中是否正确？ - 按下按钮时，焦点可以留在按钮上还是应该移至小程序？如果焦点停留在按钮上，我是否需要为屏幕 reader 用户提供一些简单的方法来跳转到小程序？如果是这样，如何以这种方式与用户沟通？我是否应该提供一种简单的方法将焦点从小程序返回到按钮？
- 这种东西，
<div>上应该有aria属性吗？有合适的咏叹调角色吗？在这种情况下使用 aria live region 宣布 div 的 showing/hiding 是否合适？
为了获得最佳的无障碍体验，您应该遵循 disclosure widget pattern。
回答您的具体问题。
- 披露模式讨论了应该在您的按钮上设置的 ARIA 属性。
- 抱歉，这与辅助功能无关，所以我无法回答。
- 一般情况下，选择按钮后不应移动焦点。如果这样做，它可能会违反 WCAG 3.2.2 On Input、“除非用户在使用该组件之前已被告知该行为”。
As至于让用户知道如何访问小程序，如果您遵循披露小部件模式，当您更改aria-expanded的值时，他们会听到“展开”或“折叠”，这样用户就会知道接下来会发生什么.您的小程序是否紧跟在 DOM 中的按钮之后？那将是最好的解决方案。如果按钮和新注入的小程序之间有元素，那可能会造成混淆。 aria-live可能非常方便，但在这种情况下，如果遵循#3，则没有必要。