删除tr会扩大其他tds

Question

我正在尝试删除Javascript中的表行但是当行确实消失时，表的第一列会变宽，我无法理解为什么。

有人可以帮助我吗？

这是我的HTML：

<table id="todos">
    <?php foreach ($todos as $row) : ?>
    <tr todoid="<?php echo $row['id']; ?>">
        <td class="isDone"><input type="checkbox" name="done" /></td>
        <td class="title" <?php if ($row['dueDate'] == null) echo "colspan='2'"; ?>><i class="delete fa fa-trash-o"></i> <?php echo $row['title']; ?></td>
        <?php if ($row['dueDate'] != null) : ?>
        <td class="dueDate"><?php echo relativeDate($row['dueDate']); ?></td>
        <?php else : ?>
        <td></td>
        <?php endif; ?>
    </tr>
    <?php endforeach; ?>
</table>

这是我的js：

    $("tr[todoid] td.title .delete").click(deleteTodoHandler);
    ...
    function deleteTodoHandler(event) {
        console.log("deleteTodoHandler");
        $(event.target).parents("tr").remove();
    }

谢谢！

Answer 1

如果未指定单元格的宽度，它们将展开以适合内容。

我删除了顶行和其他行调整，因为第二个单元格由于大字符串而不需要大量空间。

如果您不希望发生移位，则需要设置宽度。