如何创建具有合并和调整大小功能的表

How to Create a table with merger and resize function?

本文关键字：调整 功能 合并 何创建 创建      更新时间：2024-02-22

我想创建具有合并和调整大小功能的表。这两个功能看起来都像谷歌电子表格

首先，我通过Javascript库找到了合并功能

之后，使用此代码调整TD $('td').resizable();的大小，但出现了问题。

此表在运行可调整大小的函数后完成合并。

<table id="BA1"><caption></caption><thead></thead><tbody><tr><td><div class="iitem">+</div></td><td></td><td></td><td></td><td></td></tr><tr><td></td><td></td><td></td><td></td><td colspan="1"rowspan="2"></td></tr><tr><td colspan="4"rowspan="2"></td></tr><tr><td colspan="1"rowspan="2"></td></tr><tr><td></td><td></td><td></td><td></td></tr></tbody></table>

操作非常方便，合并后TD高度有限。

我不知道为什么？有更好的方法吗？

我假设您已经包含了所需的JQuery UI和CSS库，例如：

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css"> 
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

最好，您还需要调用您的resizable，如下所示。

$( function() {
    $('td').resizable();
  } );
相关文章：