在表中添加一個新行

Question

可能重複：
Add table row in jQuery

我想一個新行添加到我的桌子上的改變事件。以下是我迄今爲止：

$('#CourseID').change(function() { 
    $('#CourseListTable > tr > td:last').append('<td>...</td>'); 
}); 

這裏是我的表：

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>  
<table id="CourseListTable"> 
    <tr> 
     <th>Course ID</th> 
     <th>Course Section</th> 
     <th>Level</th>    
    </tr> 
    <tr> 
     <td><select name="CourseID" id="CourseID"></select></td> 
     <td><select name="CourseSection" id="CourseSection"></select></td> 
     <td><select name="Level" id="Level"></select></td>    
    </tr> 
</table> 

我不能得到這個工作。我錯過了這裏的任何東西，任何人都可以讓我知道我的錯誤在哪裏？

在此先感謝。

Answer 1

你提到追加行，但在你的代碼中你只追加單元格。

如果您需要實際追加一個整行，試試這個：

$('#CourseID').change(function() { 
    $('<tr/>').append('<td>...</td>').insertAfter('#CourseListTable tr:last'); 
}); 

Answer 2

這條線：

$('#CourseListTable > tr > td:last').append('<td>...</td>'); 

追加TD（<td>...</td>）到現有的TD（td:last）;你想把它附加到TR上，例如。

$('#CourseListTable > tr').append('<td>...</td>'); 

當然，你提到想添加一個新行，在這種情況下，你不應該附加一個<td>可言，你應該附加一個<tr>（你應該把它添加到表，顯然）。

Answer 3

$('#CourseID').change(function() { 
    $('#CourseListTable > tbody > tr:eq(1)').append('<td>...</td>'); 
}); 

Answer 4

如果要添加新行，你必須添加一個tr

$('#CourseListTable tr:last').after('<tr><td>...</td><td>...</td><td>...</td></tr>'); 

Answer 5

您應該使用after代替，append將在tr內追加元素。

$('#CourseID').change(function() { 
    $('#CourseListTable tr:last').after('<tr><td>test</td><td>test</td><td>test</td></tr>'); 
}); 

Answer 6

遵循這樣的：

Customizing JQuery Cloned row attributes

它可以讓你克隆，追加然後自定義每個單元..非常靈活。