jQuery를 사용하여 테이블 셀에 대한 상대적 접근

Question

중첩 된 표 3x3이 있습니다

<table>
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td id='myCell'></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>

따라서 왼쪽, 오른쪽, 상단, 하단에 내 '#MyCell'에 셀을 닫아야합니다.

var myCell = $('#myCell')[0];
var leftCell = myCell.previousSibling;
var rightCell = myCell.nextSibling;
var topCell = $(myCell).parent()[0].previousSibling().children()[myCell.cellIndex];
var bottomCell = $(myCell).parent()[0].nextSibling().children()[myCell.cellIndex];

괜찮은 것 같습니다. 이제 Specefic 테이블 레이아웃으로 동일한 셀을 가져와야합니다.

<table>
  <tr>
    <td rowspan=3></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td id='myCell'></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
  </tr>
</table>

이 레이아웃은 상단, 오른쪽, 하단 셀을 얻을 수 있음을 의미합니다.

Answer 1

직접 솔루션이 없습니다. 프로젝션 매트릭스를 사용하여 셀 근처를 계산했습니다. 내 솔루션이 출시되었습니다 GridWizard -HTML 테이블 생성자

Answer 2

가능한 각 형제 셀을 검색하기위한 특수 기능을 정의 할 수 있습니다.

var myCell = $('#myCell');

function getLeft() {
  return $(myCell).previousSibling();
}

function getRight() {
  return $(myCell).nextSibling();
}
// etc for top/right

그리고 누락 된 셀에서는 널을받을 수 있습니다.

Answer 3

안타깝게도 TR과 TD는 Colspan/Rowspan 문제를 다룰 때 신뢰할 수 없습니다. SO1303106 각 행/열의 매트릭스를 구축하고 쿼리에 도움이되는 일부 기능을 작성하는 솔루션을 보여줍니다. 이 기사 그 해결책에 영감을 주었고 문제를 보여줍니다. 솔루션은 jQuery에 따라 다르지 않으며 누군가가 더 나은 솔루션을 만들어 내면 놀라지 않을 것입니다.

Answer 4

나는 약간 다른 것을 찾는이 질문을 촉진했다. 아마도 이것은 도움이 될 것입니다. 다음 표가 주어지면 :

<table>
  <tr>
    <td>10</td>
    <td id='selectMe'>20</td>
  </tr>
  <tr>
    <td>30</td>
    <td>40</td>
  </tr>
</table>

jQuery 사용 :

$.('td#selectMe').prev('td'); //10
$.('td#selectMe').parent().next('td'); //30

이것이 또 다른 옵션과 통찰력을 제공하기를 바랍니다.