屏幕阅读器和JavaScript打印功能
我已经为网页编写了一个基于JavaScript的打印功能。它从页面上的隐藏div中提取HTML，将其呈现到一个新窗口中，并触发打印对话框 该选项通过带有屏幕阅读器和JavaScript打印功能,javascript,accessibility,screen-readers,Javascript,Accessibility,Screen Readers,我已经为网页编写了一个基于JavaScript的打印功能。它从页面上的隐藏div中提取HTML，将其呈现到一个新窗口中，并触发打印对话框 该选项通过带有onclick=“printTheThing（）”事件的按钮提供。我知道，例如，屏幕阅读器对JavaScript有一些警告我想知道是否/有多少人，如盲人或视力受损者，我阻止他们使用此功能。 该实现将打开一个新的浏览器窗口，并将以下内容附加到其文档中： function printTheThing() { var dispSettings
onclick=“printTheThing（）”按钮提供。我知道，例如，屏幕阅读器对JavaScript有一些警告我想知道是否/有多少人，如盲人或视力受损者，我阻止他们使用此功能。
该实现将打开一个新的浏览器窗口，并将以下内容附加到其文档中：
function printTheThing() {
var dispSettings = "toolbar=yes,location=no,directories=yes,menubar=yes,"
+ "scrollbars=yes,width=550,height=400",
html = $('#theDivToPrint').html(),
printWindow = window.open("", "", dispSettings),
doc = printWindow.document;
doc.open();
try {
doc.write('<html><head>');
doc.write('<title>' + title + '</title>');
doc.write('</head><body>');
doc.write(html);
doc.write('</body></html>');
} finally {
doc.close();
}
printWindow.focus();
printWindow.print();
}
函数打印内容（）{
var dispSettings=“工具栏=是，位置=否，目录=是，菜单栏=是，”
+“滚动条=是，宽度=550，高度=400”，
html=$（'#thediftoprint'）.html（），
printWindow=窗口。打开（“，”，显示设置），
doc=printWindow.document；
doc.open（）；
试一试{
文件写入（“”）；
文件书写（“”+标题+“”）；
文件写入（“”）；
doc.write（html）；
文件写入（“”）；
}最后{
doc.close（）；
}
printWindow.focus（）；
printWindow.print（）；
}
更新：这是按钮的外观：
<button type="button" onclick="printTheThing()">Print the thing!</button>
打印这个东西！
此外，我正在使用CSS将按钮替换为图像。我已经用Firefox插件“毒牙”测试了这个按钮。这表明屏幕阅读器将完美地读出原始按钮文本。但是Fangs不提供任何互动性，所以我无法用它测试打印效果。最好的方法当然是自己尝试一下
有一个Google Chrome扩展允许您这样做：要通过使用屏幕阅读器提高可访问性，请使用W3C WAI-ARIA live regions，有关更多信息，请参阅和
要进行测试，您可以使用以下屏幕阅读器：
在Windows-JAWS上，NVDA
Linux上-orca（不使用Chromium）+Florian Margaine的建议
您还可以使用来测试WCAG 2.0，第508节，斯坦卡法案可访问性标准的合规性。完全不应该依赖Chrome扩展。你应该用NVDA测试东西，这是免费的。我猜谷歌粉丝会说Chrome Vox很好。相信我，我已经在AT工作了将近15年
无论如何，我需要查看按钮的代码，而不是JS。。。JS看起来不错。有些人很难知道有一个新窗口，但是打印对话框应该抓住窗口的焦点呈现可打印页面的方法是使用@media
CSS指令。这样，您就不需要做任何特殊的事情，比如弹出另一个窗口或担心可访问性：内容只是正确打印（如果您需要的话，可能与屏幕布局非常不同）。自己试一试怎么样？像这样：-）将其添加为答案？针对Windows的NVDA、针对Linux的Orca、针对OS X的VoiceOver和您的答案的+1:）感谢+1@chiccodoro，HTML看起来不错。这不仅仅是关于打印机友好的布局。我只想打印页面上的一小部分信息，这只适用于那个按钮。如果用户选择File->Print页面，则应打印整个页面。这是一个很好的信息，但与原始问题无关：WAI-ARIA Live regions专门用于页面中实时更新的区域，如股票代码和新闻提要等。OP更关心的是基本javascript是否能与屏幕阅读器一起工作（简短回答：是的，但测试确认）。谢谢，dae。虽然有些提示与我的问题没有直接关系，但有些是。顺便说一句：我决定采用非JavaScript的方式，尽管它可能会受到屏幕阅读器的支持，因为让网站在没有JavaScript的情况下运行还有其他原因。