Question

这是我的样本表格格式：

这是我为<tr>动态设置tabIndex的代码（完全适用于Chrome和FF但不适用于IE 8）：

<html>
    <head>
        <script src="jquery-1.10.2.js"></script>
        <style>
            td {
                color: blue;
            }
            :focus {
                color: red;
            }
        </style>
        <script>
            $(document).ready(function() {
                $("tr").attr( "tabIndex", function ( i ) {
                    return i + 1;
                });
            });
        </script>
    </head>
    <body>
        <table>
            <thead></thead>
            <tbody>
                <tr><td>Five</td></tr>
                <tr><td>Four</td></tr>
                <tr><td>Three</td></tr>
                <tr><td>Two</td></tr>
                <tr><td>One</td></tr>
            </tbody>
        </table>
    </body>
</html>

任何人都可以帮忙解决如何解决在表格行上设置tabIndex的问题，这对于浏览器都有效，特别是在IE8上？

Answer 1

在HTML 4.01中，tabIndex属性仅限于较小的可聚焦元素集，不包括表行。我怀疑这可能是你遇到的问题的情况，但是在JSFiddle上进行一次测试后，我发现IE 8实际上是在适当地处理代码。

这是我站起来测试问题的快速演示：

<table>
    <tr><td>Five</td></tr>
    <tr><td>Four</td></tr>
    <tr><td>Three</td></tr>
    <tr><td>Two</td></tr>
    <tr><td>One</td></tr>
</table>

:focus {
    background: yellow;
}

$("tr").attr( "tabIndex", function ( i ) {
    return 5 - i;
});

正如您在下面的GIF中所看到的，IE 8按预期工作。

enter image description here

那么问题是什么呢？检查你的jQuery版本; jQuery 2.x版本不支持Internet Explorer 8.如果您想支持半年前的浏览器，则需要使用jQuery 1.x版本。

设置表行的tabIndex在IE8中不起作用

1 个答案: