table的拖拽选中区域(包含行合并和列合并的处理)

最近碰到一个表格的增删问题，一个主要的问题在于需要用鼠标拖拽去选中区域，然后对选中的区域进行操作。在网上找了些代码，做了个总结。原理是在鼠标刚开始点击的点和鼠标移动的点，两个点之间生成一个矩形，然后用这个矩形去和表格中的td进行碰撞检测，但是因为是表格，当然会有行合并和列合并的问题。我的思路是使用递归函数，在每一次矩形和表格碰撞完之后，重新改变矩形的定位和宽高，然后再进行碰撞检测，直到达到某个条件时，停止。我在每个和矩形块碰撞到的td上加了一个class(grayColor),然后循环遍历，需要取到4个值，最小的距离上边框的距离(offset().top)、最大的距离上边框的距离(offset().top+outerHeight())、最小的距离左边框的距离(offset().left)、最大的距离左边框的距离(offset().left+outerWidth),然后对矩形块更新，宽度为最大距离左边框的距离减去最小的距离，高度同理，top值为最小的距离上边框的值，left值同理，然后再去和table内的td去做碰撞检测，直到后一次和前一次的所有距离相等，即两次的最小距离上边框的值、最大距离上边框的值、最小距离左边框的值、最大距离左边框的值都相等时，函数停止执行。这样做的好处是，不需要去考虑colspan的值和rowspan的值，反正我找的用colspan和rowspan的做处理的，我没有看懂，毕竟，我是一只小菜鸟。下面贴上代码最近碰到一个表格的增删问题，一个主要的问题在于需要用鼠标拖拽去选中区域，然后对选中的区域进行操