Номер строки и столбца таблицы в jQuery
Как получить номер строки и столбца ячейки нажатой таблицы с помощью jQuery, т. е.
$("td").onClick(function(event){
var row = ...
var col = ...
});
6 ответов
можно использовать Базовый/индекс функция в данном контексте, например, вы можете проверить индекс TD в его родительском TR, чтобы получить номер столбца, и вы можете проверить индекс TR в таблице, чтобы получить номер строки:
$('td').click(function(){
var col = $(this).parent().children().index($(this));
var row = $(this).parent().parent().children().index($(this).parent());
alert('Row: ' + row + ', Column: ' + col);
});
Проверьте запущенный пример здесь.
$('td').click(function() {
var myCol = $(this).index();
var $tr = $(this).closest('tr');
var myRow = $tr.index();
});
получить индекс столбца по клику:
$(this).closest("td").index();
получить индекс строки по щелчку:
$(this).closest("tr").index();
С моей головы, одним из способов было бы захватить все предыдущие элементы и подсчитать их.
$('td').click(function(){
var colIndex = $(this).prevAll().length;
var rowIndex = $(this).parent('tr').prevAll().length;
});
можете ли вы выводить эти данные в ячейки при создании таблицы?
Так что ваша таблица будет выглядеть так:
<table>
<thead>...</thead>
<tbody>
<tr><td data-row='1' data-column='1'>value</td>
<td data-row='1' data-column='2'>value</td>
<td data-row='1' data-column='3'>value</td></tr>
<tbody>
</table>
тогда это было бы просто дело
$("td").click(function(event) {
var row = $(this).attr("data-row");
var col = $(this).attr("data-col");
}
лучше привязать обработчик щелчка ко всей таблице, а затем использовать событие.цель, чтобы получить щелчок TD. Это все, что я могу добавить к этому, как его 1:20на