16

テーブル内のセルのXY位置を取得するための良い方法を探しています。（css-positionと混同しないでください。デカルト座標系でX座標とY座標を探しています）。

ご存知のように、ex：を使用してテーブル内の特定のセルを取得できます$('#grid')[0].rows[5].cells[7]。

5x7しかし、特定のセルをクリックしたときに値を取得したい場合はどうなりますか。

$('#grid td').click(function(){
   alert("My position in table is: " + myPosition.X + "x" + myPosition.Y);
});

おそらく、最も簡単な方法は、バックエンドでテーブルを作成するときにすべてのセル（など）にinnerHTML、ID、またはCSSクラスを追加し<td class="p-5x7">、それを解析してクリックして戻ることですが、これらの座標を純粋に基づいて取得する方法はありますか？ DOM？

4

2 に答える 2

44

DOMレベル2HTMLcellIndex：

alert('My position in table is: '+this.cellIndex+'x'+this.parentNode.rowIndex);
于 2009-11-21T13:40:37.277 に答える
0 

window.onload = function () {
  document.getElementsByTagName('table')[0].addEventListener('click', function(e) {
    alert("My position in table is: " + e.target.parentElement.rowIndex + "x " + e.target.cellIndex + "y");
  }, false);
}
tr, td {
  padding: 0.6rem;
  border: 1px solid black
}

table:hover {
  cursor: pointer;
}
<table id="grid">
  <tr>
    <td>0, 0</td>
    <td>0, 1</td>
    <td>0, 2</td>
  </tr>
  <tr>
    <td>1, 0</td>
    <td>1, 1</td>
    <td>1, 2</td>
  </tr>
</table>

于 2017-11-02T15:57:20.420 に答える