Question

我有两张桌子。第一行是一行高，包含7个tds。

第二个是6行高，包含7个tds。

当用户单击第一个表中的td时，相应列中表2中具有类'x'的最后一个单元格已删除类'x'并添加了类'y'。

因此，下次单击同一列时，其上方的单元格将删除“x”类并添加“y”类，依此类推......

我已设法使用允许您选择'nth-col'的插件选择相应的列：

$('#table1 td').click(function(){

    var col = ($(this).index()+1);

    $('#table2 td:nth-col('+col+')').removeClass('x').addClass('y');

});

但是无法弄清楚如何选择行！

如果你想知道我在做什么，那么基本上我正在尝试连接四个。

Answer 1

你可以在没有任何插件的情况下完成。按相反顺序浏览行，检查第N个td元素。在您找到的第一个循环之后退出循环。这是一个简单的解决方案，可能无法正确优化以处理数千行/列。：）

现场演示：http://jsfiddle.net/yydZ3/1/

//Set all classes to x
$('td').addClass('x');

$('td').click(function(){
    var $this = $(this);
    var col = $this.index();

    //Iterate through rows in reverse order
    $($('tr').get().reverse()).each(function(){
        var $cell = $(this).find('td:eq('+col+')');
        if($cell.hasClass('x')){
            //Found one, this must be the last in this column
            $cell.removeClass('x').addClass('y');

            //Exit out of each loop
            return false;
        }
    });
});

Answer 2

选择适当的tr（行），然后选择td元素（单元格）：

$('#table2 tr:eq('+row+') td:eq('+col+')').removeClass('x').addClass('y');

查看一个非常基本的测试：http://jsfiddle.net/MgTGf/1/

jQuery按条件选择表中的最后一个单元格

2 个答案: