如何追加新的<tr>當前<tr>

Question

我有以下表結構。

<table> 
    <tr> 
     <td><a href="#"></td> 
    </tr> 
</table> 

當我點擊<a>我要添加新的<tr>旁邊<tr>其中被點擊<a>。

那麼結果將是：

<table> 
    <tr> 
     <td><a href="#"></td> 
    </tr> 
    <tr> 
     <td><a href="#"></td> 
    </tr> 
</table> 

Answer 1

例子：

$('a').bind('click', function(){ 
    $('<tr><td>new td</td></tr>').insertAfter($(this).closest('tr')); 
}); 

如果你想創建一個克隆使用：

$('a').live('click', function(){ 
    var $this  = $(this), 
     $parentTR = $this.closest('tr'); 

    $parentTR.clone().insertAfter($parentTR); 
}); 

實例鏈接：http://www.jsfiddle.net/7A6MQ/

基本上，您從tr element（其中包括子節點）創建一個副本，並在該元素之後插入該副本。因此，您需要綁定.live以確保新創建的a元素也可以調用該點擊處理程序。

參考：.clone()，.insertAfter()，.live()

Answer 2

此外，你可以寫：

$('a').bind('click', function() { 
    $(this).closest('tr').after('<tr><td>new td<td></tr>'); 
}); 

沒有如此大的差別，但看起來更具可讀性。

Answer 3

這是代碼。請檢查並告訴我是否有任何問題。

function AddRaw(obj){ 
var $this  = obj; 
$parentTR = $this.closest('tr'); 
$parentTR.clone().insertAfter($parentTR); 
}