Question

我有一个表格，我正在显示一些标题信息。我在桌子的最右边有一个链接，当点击时，我希望在当前行下面显示详细信息。我怎样才能达到这个效果？

- Edit--
使用下面的想法，我尝试了以下代码（没有用） -

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

使用jQuery在表行之间显示详细信息

1 个答案: