使用nextUntil查找当前单元格的索引

时间:2012-12-28 06:38:07

标签: javascript jquery-selectors jquery

这是我试图从

学习的问题

jQuery selector to grab cells in the same column

在提出使用索引和nth-child的任何答案之前,我正在考虑在$(this)单元格之前计算单元格数 - 例如

var columnNo = parentRow.nextUntil($(this),"td").length;
console.log(columnNo); // gives 0 - what am I missing?
parentTable.find("tr td:nth-child(" + (columnNo+1) + ")")

http://jsfiddle.net/mplungjan/JUt4F/

问题:

  1. 为什么nextUntil没有给出前面单元格的长度?
  2. 2。为什么点击只能工作一次?

    请注意我知道(在问这个之前)我可以使用索引。我只是想修复我的脚本来探索nextUntil

    UPDATE :我似乎混合了nextAll和nextUntil,可能想象出某种nextAllUntil

1 个答案:

答案 0 :(得分:2)

nextUntil()方法会在父行中找到第一个td标记。有了这个逻辑,你只需要选择每一行中的第一个单元格。点击工作每次都在进行 - 你只是将相同的列重复着色。

您需要做的是搜索父行上的所有td标记,并使用jQuery的index()方法来识别该行中单击的单元格的位置。

一个非常小的调整将解决问题:

$("td").on("click",function(){
    var parentTable = $(this).closest("table");
    var parentRow = $(this).parent();
    console.log(parentRow);
    var columnNo = parentRow.find('td').index($(this));
    console.log(columnNo);
    parentTable.find("tr td:nth-child(" + (columnNo+1) + ")")
        .css("color", "red");
});​

工作示例:http://jsfiddle.net/JUt4F/15/