可访问性如何使用 onclick 处理 tr 标签？答案

【问题标题】：Accessibility how do I handle tr tags with onclick?可访问性如何使用 onclick 处理 tr 标签？
【发布时间】：2022-02-06 04:21:13
【问题描述】：

我正在研究辅助功能，并在我的“tr”标签中添加了一个“tabindex = 0”。问题是如果我进入那个“tr”并在我的键盘上按“Enter”，“onclick”不起作用，但如果我用鼠标点击链接它仍然有效。我尝试在声明“onclick”的“tr”标签内添加一个锚标签，但这不起作用。这也在 python 代码中使用，其中“tr”是字符串的一部分。这是我的代码。

#print open shifts line

personal_table += """ <tr tabindex="0" class="open_shift_line odd clickable" 
onclick="pop_over_window('/AcStaf/Home/my_self_schedule?id=%s&bdate=%s&edate=%s','Open Shifts')">
<td>%s%s&nbsp;Open Schedule</td> <td style="color:#EB0000">Closes %s at %s</td></tr>""" 
%(id, per_startdate, per_enddate, sch_req_text, container.util.getDateDisplay(bdate=per_startdate, edate=per_enddate, date_format='%m-%d-%Y'),
container.util.getDateTimeStr(date=pub_period['publish_edate'], fmt='%m-%d'), container.util.format_acutime(acutime=pub_period['publish_etime']))

是否需要将 onclick 替换为“a href”？我有哪些选择？

【问题讨论】：

希望我给出的这个答案会有所帮助：stackoverflow.com/questions/64776155/…。我没有将问题标记为重复，因为问题略有不同，但那里解释的所有原则都适用，它为您提供了一些可通过键盘访问以及可通过鼠标使用的选项！

标签： javascript python html accessibility

【解决方案1】：

您可以通过一些 javascript（在此示例中使用 jQuery）来实现：

$(document).keyup(function(event) {
  if (event.keyCode === 13) { //13 is enter key
    $(':focus').trigger('click'); // clicks focused element
  }
});

【讨论】：

【解决方案2】：

所有人工聚焦且 tabindex=0 不会自动以任何方式对键盘作出反应的元素。您必须自己处理键盘事件。

这让很多人感到困惑。

相比之下，自然可聚焦的元素（例如链接或按钮）具有对键盘事件的内置支持。按 enter 会触发 onclick 或 onsubmit 处理程序，而无需您执行任何操作。

这就是为什么通常建议尽可能使用自然可聚焦的元素。但是，对于您的情况，您不能。

所以简而言之，你必须自己处理回车键。

【讨论】：