jQuery의 테이블 행 및 열 번호

jQuery를 사용하여 클릭 한 테이블 셀의 행과 열 번호를 얻는 방법, 즉

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

주어진 컨텍스트에서 코어 / 인덱스 함수를 사용할 수 있습니다. 예를 들어 상위 TR에서 TD의 인덱스를 확인하여 열 번호를 얻을 수 있고 테이블에서 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();
});

클릭시 COLUMN INDEX 받기 :

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

클릭하면 ROW 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");
}

클릭 처리기를 전체 테이블에 바인딩 한 다음 event.target을 사용하여 클릭 한 TD를 얻는 것이 좋습니다. 그게 내가 1:20 am으로 이것에 추가 할 수있는 모든 것