Как найти «визуальное местоположение» каждой ячейки таблицы с помощью jQuery ?

У меня есть таблица HTML, содержащая как ROWSPAN, так и COLSPAN.

Как найти «визуальное местоположение» каждой ячейки с помощью jQuery?

Например, вот визуальное представление моей таблицы с каждой ячейкой, заполненной тем, что должен возвращать алгоритм «визуального местоположения»:
(Примечание: меня действительно интересуют только ячейки внутри и ссылка на столбец может быть целым числом, а не буквенным символом, я сделал это только для того, чтобы легко выделить проблему)

+--+--+--+--+--+
|  |A |B |C |D |
+--+--+--+--+--+
|1 |A1|B1   |D1|
+--+--+--+--+  +
|2 |A2   |C2|  |
+--+     +--+  +
|3 |     |C3|  |
+--+--+--+--+--+
|4 |A4|B4|C4|D4|
+--+--+--+--+--+
|XYZ           |
+--+--+--+--+--+

Я пытался реализовать первый вариант, однако ссылка на ячейку C3 неточна, поскольку она не t принимать во внимание ROWSPANS. Вторую ссылку можно объединить с решением первой, но я не могу понять, как это сделать.

Я надеюсь использовать это как функцию с именем getCellLocation(cell), которая будет возвращать ассоциативный массив, который возвращает местоположение примерно так:

function getCellLocation(cell)
{
  var row_number = parseInt($(cell).parent().prevAll().length) + 1;
  var col_number = 1;
  $(cell).prevAll('td').each(function() {
      col_number += $(this).attr('colspan') ? parseInt($(this).attr('colspan')) : 1;
  });

  var location = new Array();
  location['row'] = row_number;
  location['col'] = col_number;
  location['index'] = $('td').index(cell) + 1;
  return location;
}

$('table td').each(function(i){
  var cell = getCellLocation($(this));
  $(this).prepend('R' + cell['row'] + ':C' + cell['col'] + ':D' + cell['index'] + '');
});

Вот HTML примера таблица:

A B C D
1 A1 B1 D1
2 A2 C2
3 C3
4 A4 B4 C4 D4
XYZ

11
задан Community 23 May 2017 в 10:27
поделиться