2

假设我们只有一个简单的表格，如下所示。我可以通过按 Tab 键浏览 TD。 

<table>
    <tr>
        <td>...</td>
        <td>...</td>
        <td>...</td>
    </tr>
</table>

当我在最后一个 TD 上按制表符时，我想附加一个新的 TR。我已经尝试了很多事情，但我就是无法让它发挥作用。

希望有人有解决方案！

编辑：

目前，这是我试图开始工作的脚本。

$(document).keydown(function(e) {
   if (e.keyCode === 9) {
       var test = $(this).closest("td").next().find("td");
       console.log(test);

       $('tr:last td:last').addClass('last').css({backgroundColor: 'yellow'});

       if($('td').hasClass("last")) {
           $(this).append('test');
       }
   }
});
4

2 回答 2

2

你可以试试这样的

Javascript

$('table').on('keydown', 'input', function (e) {
    var keyCode = e.keyCode;
    if (keyCode !== 9) return;
    var $this = $(this),
        $lastTr = $('tr:last', $('table')),
        $lastTd = $('td:last', $lastTr);
    if (($(e.target).closest('td')).is($lastTd)) {
        $lastTr.after($lastTr.clone());
    }
});

检查小提琴

于 2013-06-06T10:07:04.320 回答
0

假设你的意思是使用输入元素，你可以做一些事情，在表格之后添加一个额外的输入元素，然后向这个元素添加一个焦点事件。

例如这样的事情：

<table>
    <tr>
        <td><input type="text"/></td>
        <td><input type="text"/></td>
        <td><input type="text"/></td>
    </tr>
</table>
<div id="hideAddRow">
    <input type="text" id="addRow"/>
</div>

以及以下js：

$('#addRow').on('focus', function () {
  alert('add new row code here.'); 
});

或者看看这个 jsfiddle 例子：http: //jsfiddle.net/sGQ23/

于 2013-06-06T09:58:40.277 回答