实现可访问性的副本

Question

实施辅助功能以从<p>元素中复制文本的推荐方法是什么？

例如，

<p class='text'>Some text to copy</p>

<p>元素是通过AJAX调用插入DOM的。需要应用哪些ARIA标记，以便在生成和插入时，用户可以轻松地进行复制。

所有想法都赞赏。

Answer 1

至少有两种好方法可以做到这一点：

1. 改为<p> <textarea readonly>。因此，如果他/她想要，用户可以自由地浏览textarea中的文本，并且他/她也可以通过按 Ctrl + A 立即复制所有内容。
2. 您可以放置​​«复制到剪贴板»链接或按钮。有window.clipboardData的IE专用解决方案，但在2014年这有点荒谬，因为盲人用户（以及其他用户）使用不同的浏览器，包括（但不限于）IE，Firefox，Chrome和Safari。 /> 但是，我在不同的网站上看到了使用Flash实现的按钮。如果你设法处理它，你可以使用它 您可以在this question的第一个答案中查看有关Flash解决方案的更多信息，并按照其中提供的链接进行操作。

Answer 2

我没有删除<p>，但最终在<input>下使用<p> z-index:-1;。它为我解决了两个问题： -

1. 专注于新插入的role=dialog模式。
2. 保留为受挑战用户选择的文本以进行复制。

我相信有更好的方法可以做到这一点。但是现在它对我有用。

Answer 3

最好的方法是直接将其复制到用户剪贴板，但这只是IE：

window.clipboardData.setData("Text", whatever_to_copy);

如果您希望仅将数据保存在您的网站上，则可以使用localStorage将其存储在您的域中。