Tabellenzeilen- und Spaltennummer in jQuery

Wie erhalte ich die Zeilen- und Spaltennummer der angeklickten Tabellenzelle mit jQuery, dh

$("td").onClick(function(event){
   var row = ...
   var col = ...
});

Sie können die Core / Index- Funktion in einem bestimmten Kontext verwenden. Sie können beispielsweise den Index des TD in seiner übergeordneten TR überprüfen, um die Spaltennummer zu erhalten, und Sie können den TR-Index in der Tabelle überprüfen, um die Zeilennummer zu erhalten:

$('td').click(function(){
  var col = $(this).parent().children().index($(this));
  var row = $(this).parent().parent().children().index($(this).parent());
  alert('Row: ' + row + ', Column: ' + col);
});

Prüfen Sie das laufende Beispiel hier .

$('td').click(function() {
    var myCol = $(this).index();
    var $tr = $(this).closest('tr');
    var myRow = $tr.index();
});

Holen Sie sich COLUMN INDEX auf Klick:

$(this).closest("td").index();

Holen Sie sich ROW INDEX auf Klick:

$(this).closest("tr").index();

Eine Möglichkeit wäre, alle vorherigen Elemente zu erfassen und zu zählen.

$('td').click(function(){ 
    var colIndex = $(this).prevAll().length;
    var rowIndex = $(this).parent('tr').prevAll().length;
});

Können Sie diese Daten in den Zellen ausgeben, während Sie die Tabelle erstellen?

Ihr Tisch würde also so aussehen:

<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>

dann wäre es eine einfache Sache

$("td").click(function(event) {
   var row = $(this).attr("data-row");
   var col = $(this).attr("data-col");
}

Es ist besser, einen Klick-Handler an die gesamte Tabelle zu binden und dann event.target zu verwenden, um den angeklickten TD abzurufen. Das ist alles, was ich hinzufügen kann, da es 1:20 Uhr ist