jQuery выбрать последнюю ячейку таблицы по условию

Question

У меня есть две таблицы. Первый имеет высоту в одну строку и содержит 7 тд.

Второй имеет 6 строк в высоту и содержит 7 тд.

Когда пользователь щелкает 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/