无法在 IE8 中多次设置 tabIndex

Question

我有一个大型 HTML 数据输入表，以大型输入字段矩阵的形式实现。我正在尝试实现一个基于 JavaScript 的功能，该功能可以在按行和按列的 Tab 键顺序之间动态切换。

我使用的方法似乎只在 IE8 中有效“一次”。也就是说，一旦使用 JavaScript 设置了选项卡索引，任何后续更改都将被忽略 - 并且选项卡顺序将恢复为其默认状态。

表输入的类名如下：

.row-0 .col-0 | .row-0 .col-1 | .row-0 .col-2 | ...
--------------+---------------+---------------+----
.row-1 .col-0 | .row-1 .col-1 | .row-1 .col-2 | ...

我的 JavaScript 看起来像这样：

nCols = ...;
nRows = ...;

function setTabOrder(byCol) {
    var max = byCol ? nCols : nRows;
    var selector = byCol ? '.col-' : '.row-';
    var tabIndex = 1;
    for (var i = 0; i < max; i++) {
        $(selector + i).each(function () {
            this.tabIndex = tabIndex++;
            //this.value = this.tabIndex;
        });
    }
}

实际上，如果在页面加载时调用 setTabOrder(true); ，我似乎只能按列进行制表，即：

$(function () {
    setTabOrder(true);
});

任何想法为什么会这样没有像我预期的那样工作？

Answer 1

我建议您以不同的方式执行此操作，即在所有条目项上放置选项卡键的事件处理程序，然后使用该键的事件来查找行或列中的下一个项目，具体取决于您想要的内容，以及然后对该输入调用 setFocus() 。如果需要，您可以对 Shift+Tab 执行相反的操作。

这可以避免您的问题，并且不能真正回答您的问题，但它也可以消除对您所拥有的 .col- 和 .row- 命名方案的需要，这可能会导致更易于维护的设计。