javascript - 如何删除具有不同列的html表的最后一列

Question

我有一个列表的记录列表 - 一个 HTML 表。

大多数行有 3 列，但有些可能只有 1 或 2 列。在这种情况下，我使用 colspan 并将其拉伸到其他列。

我想要做什么：当用户单击页面上的按钮时，我想删除最后一列（折叠），前提是它有多个列。

jquery 怎么可能（如果可以的话）？

Answer 1

尝试这样的事情

$('tr').each(function(){
   $("td:last").hide()
})

Answer 2

试试这个

$('tr').each(function(){
  $("td:last").hide();
})

Answer 3

您可以这样做，但您还应该向表中添加一个类，以便您可以按类选择所需的表。

if($('tr').length > 1) {
   $('tr').each(function(){
      $("td:last").hide()
   })
}

如果您添加例如 myTable 类，请执行以下操作：

if($('.myTable tr').length > 1) {
   $('.myTable tr').each(function(){
      $(".myTable tr td:last").hide()
   })
}

Answer 4

我认为您需要在删除最新列之前保存行中的列数（colspan）以使表格响应。

写了一个小函数。未在行动中尝试过

<button onclick="removeLatestCol()"></button>

<script>
function removeLatestCol() {
    var latest_row = $("table tr:last");
    var cols = $("td", latest_row);

    if (cols.length == 1) {
        latest_row.remove();
        return;
    }

    var latest_col = cols.filter(":last");
    latest_col.prev().attr("colspan", (latest_col.prev().attr("colspan") || 1) + (latest_col.attr("colspan") || 1));
    latest_col.remove()
}
</script>