在最後的td上按下標籤上添加表格行

假設我們只有一個簡單的表格，如下所示。我可以通過按Tab鍵瀏覽TD。在最後的td上按下標籤上添加表格行

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

當我按最後一個TD上的標籤，我想附加一個新的TR。我已經嘗試了很多東西，但我無法讓它工作。

希望有人有解決方案！

編輯：

目前這是腳本IM試圖讓工作。

$(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'); 
     } 
    } 
});

來源

2013-06-06 guidsen

_I've試過很多things_能否請你告訴我們一些！ –

請提供代碼...還有您嘗試過的「許多事情」。 – Dom

假設你的意思是使用輸入要素，你可以做一些事情，你表後再添加一個額外的輸入元素，然後對焦點事件添加到這個元素。

例如下面這樣的：

<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-06 09:58:40 jeffreydev

你可以嘗試這樣的事情

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()); 
    } 
});

Check Fiddle

來源

2013-06-06 10:07:04

在最後的td上按下標籤上添加表格行

回答

相關問題