Question

以下代码是侧边栏中的一个选定项目：

<table cellpadding="0" cellspacing="0" border="0" align="left">
   <tr>
      <td valign="top">
         <ul class="mainsidebar">
            <li class="mainsidebarli">
               <table cellpadding="1" cellspacing="0" border="0" width="100%">
                  <tr>
                     <td class="sidebarIcon" valign="middle"><a class="sidebarLink" href="list.jsp"><img src="/images/sidebar/residents.png" width="28" height="28" border="0" hspace="0" vspace="0"/></a></td>
                     <td class="sidebarLabel" valign="middle"><a class="sidebarLink" href="list.jsp">The List</a></td>
                  </tr>
               </table>
            </li>
         </ul>
      </td>
   </tr>
</table>

mainsidebar是应用程序的主要右侧导航。目前，当鼠标悬停在列表项中的一个表上时，感谢jQuery＆amp; CSS，整个表格的风格变化。

使用Tab键浏览此侧栏时会出现问题。目前，焦点集中在最内层表格中的每个href。所需的效果是表格本身可以获得键盘焦点，这样它可以使用鼠标悬停看到相同的颜色变化，并允许键与单击任一链接相同。

这是怎么做到的？

Answer 1

您可以通过向其添加tabindex来使表格具有焦点。

适用于Chrome，Firefox，Opera和Safari。

要让它在IE中运行，你可以添加一点jQuery：

$('td,th').on('focus',
  function() {
    $(this).closest('table').focus()
  }
)

示例： http://jsfiddle.net/5fagh2tf/10/

管理焦点到HTML表

1 个答案: