javascript - 通过单击 td 切换表格行

Question

请检查 fiddle 链接 http://jsfiddle.net/mv7Y5/89/

我正在尝试通过单击 td 来切换表格行， 这没有发生，请提供帮助。

    $(function() {
    $(".details").hide();
    $('.show-details').click(function(e) {
        $(this).next("tr").slideToggle(500);
    });
});

Answer 1

您在被点击的 td 上调用 next()(无论如何在第一个单元格上)。 next() 的作用是找到与选择器匹配的相关元素的最近兄弟。没有 tr 是被点击的 td 的兄弟。您需要确保在 tr 上调用 next()，以便它可以找到 next tr:

$(function() {
    $(".details").hide();
    $('td.show-details').click(function(e) {
        $(this).parent().next("tr").slideToggle(500);
    });
});

此外，您在该 jsfiddle 中的标记有点古怪(例如，您的行中的列数不一致，我认为这可能是某些拼写错误的结果。)