如何通过jQuery选择表中的某些单元格

我正在构建一个谷歌硬盘如何将表格插入文档的克隆。基本上，有一个正方形网格，允许您选择需要多少行和列。通过悬停，您可以选择一组行/列，从左上角开始，一直到指针。我似乎无法使突出显示正常工作，因为需要疯狂的选择器

这就是我现在拥有的：

$('.row-add:lt(' + hoveredRows + ') .cell-add:lt(' + hoveredCols + ')').addClass('cell-highlight');

哪些状态查找小于用户所选行数的行，然后在其中选择小于用户所选列数的列

问题是它只在第一行中工作，我想这是因为每个单元格的索引不会因为它在新行中而重置

例如：

相关代码：

$'.cell add'。悬停 作用{ //您选择了多少行/列？ var hoveredCols=$this.index+1， hoveredRows=$this.parent.index+1； //删除旧的突出显示 $'.cell highlight'.removeClass'cell-highlight'； //更新文本提示 $'.table维度结果'.htmlhoveredRows+'x'+hoveredCols； //将高亮显示添加到从左上角到光标的选定正方形 $'.row add:lt'+hoveredRows+'.cell add:lt'+hoveredCols+.addClass'cell-highlight'； }，功能{ //删除旧的突出显示 $'.cell highlight'.removeClass'cell-highlight'； }; .表格维度{ 填充：10px； 字号：0； 线高：0； } .表格维度结果{ 边缘顶部：10px； 字体大小：14px； 文本对齐：居中； 边框：1px实心ccc； 线高：1.4em； } .行添加{ 空白：nowrap； } .单元格添加{ 显示：内联块； 宽度：10px； 高度：10px； 边框：5px实心fff； 背景：ccc } .单元格突出显示{ 边框：5px实心fff； 背景：ec4b22； 光标：指针； } 0x0 列高亮显示有效，行高亮显示无效。问题在于，它不是基于子位置，而是基于返回的元素数。您确实需要使用基于子对象位置的选择器。您可以通过混合使用“：not”和“：nth-child1n+”+hoveredCols+1+来实现这一点。就这样,

$('.row-add:lt(' + hoveredRows + ') .cell-add:not(:nth-child(1n+' + (hoveredCols+1) + '))').addClass('cell-highlight');