用jQuery顯示錶格行之間的詳細信息

Question

我有一個表格，我正在顯示一些標題信息。我在表格的最右側有一個鏈接，點擊時，我想讓詳細信息出現在當前行的下面。我怎樣才能達到這個效果？

- 編輯 -
使用以下你的想法，我想下面的代碼（沒有工作） -

 
function showRdmDtl(flxkey, data) { 
    var flxkey; 
    var anchorId='a_'+flxkey 
    lResponse = JSON.parse(data); 
    $.each(lResponse.rdmDetails, function(intIndex, objValue) { 
     $(anchorId).closest('tr').after('').next().append(''+objValue.date+''+objValue.amount+'').show() 
    }); 
} 

知道爲什麼這是行不通的？

Answer 1

我想你在這裏有不同的可能性。例如，您可以在表格的每一行下方添加另一行，其中將包含詳細信息以及哪些行將首先隱藏。當用戶點擊鏈接，你可以只顯示它：

<tr> 
    <td><a href="#">Details</a></td> 
</tr> 
<tr style="display:none;"> 
    <td>Some details about previous row</td> 
</tr> 
... 

$('table a').click(function() { 
    $(this) 
     .closest('tr') 
     .next() 
     .show(); 
}); 

另一種可能是使用AJAX來加載有關該行的詳細信息，並把它添加到表：

<tr> 
    <td><a href="#">Details</a></td> 
</tr> 
... 

$('table a').click(function() { 
    $(this) 
     .closest('tr') 
     .after('<tr></tr>') 
     .next() 
     .load('http://www.example.com/details'); 
});