Question

我遇到了jQuery的问题。我正在制作一张桌子，其中每个<td>都有一个<input>。我使用它来使 Tab 键按列提前聚焦：

var i = 0;
$('#pl_table tr').each(function () {
    $(this).find('td').each(function (i) {
        $(this).find('input').attr('tabindex', i + 1);
    });
});

我的问题是如果我使用此代码，则无法从表格输入中选择输入值。即使使用鼠标也不能使用 Shift +箭头。

表格行如下所示：

<tr class='tripRow nopair' id='1'>
    <td class='drop'></td>
    <td id='col1' class='check'>
        <input name='tripRow1[]' type='checkbox' name='maked' value='marked' />
    </td>
    <td id='col2' class='center'>
        <input name='tripRow1[]' type='text' value='' size='2' />
    </td>
    <td id='col3' class='center'>
        <input name='tripRow1[]' type='text' value='' maxlength='10' size='10' readonly />
    </td>
    <td id='col4' class='center'>
        <input name='tripRow1[]' type='text' value='' maxlength='6' size='4' />
    </td>
    <td id='col5' class='center'>
        <input name='tripRow1[]' type='text' value='' maxlength='1' size='1' />
    </td>
    <td id='col6' class='center'>
        <input class='dispatch' name='tripRow1[]' type='text' value='' />
    </td>
    <td id='col7' class='center'>
        <input name='tripRow1[]' type='text' value='' />
    </td>
    <td id='col8' class='center'>
        <input name='tripRow1[]' type='text' value='' maxlength='3' size='3' />
    </td>
    <td id='col9' class='center'>
        <input name='tripRow1[]' type='text' value='' maxlength='10' size='10' />
    </td>
    <td id='col10' class='center'>
        <input name='tripRow1[]' class='timePicker' type='text' value='' maxlength='8' size='8' />
    </td>
    <td id='col11' class='center'>
        <input name='tripRow1[]' class='timePicker' type='text' value='' maxlength='8' size='8' />
    </td>
    <td id='col12' class='center'>
        <input name='tripRow1[]' class='timePicker' type='text' value='' maxlength='8' size='8' />
    </td>
</tr>

我知道其中一个<td>是只读的，但我也遇到了问题。我使用的是IE10。

有什么建议吗？非常感谢你的帮助。

Answer 1

如果我没有出错，你想要降低顺序，你需要这样的代码，

$(function () {
    var tdLength = $("#pl_table tr:first td").length;
    var k = 0;
    for (var i = 0; i < tdLength; i++) {
        $('#pl_table tr').each(function () {
            $(this).find('td:eq(' + i + ') input').attr('tabindex', k++)
        });
    }
});

JSFiddle DEMO

输入文字不可选

1 个答案: