Столбец обхода таблицы JQuery - PullRequest
2 голосов
/ 22 декабря 2011

У меня есть следующая таблица:

<table>
<tr>
<th scope="col"></th>
<th scope="col">Column One</th>
<th scope="col">Column Two</th>
<th scope="col">Column Three</th>
<th scope="col">Column Four</th>
</tr>
<tr>
<th scope="row">Row One</th>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<th scope="row">Row Two</th>
<td></td>
<td></td>
<td class="click"></td>
<td></td>
</tr>
<tr>
<th scope="row">Row Three</th>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<th>Row Four</th>
<td></td>
<td></td>
<td class="target"></td>
<td></td>
</tr>
<table>

Я хотел бы иметь возможность нажать на <td> с классом «щелчка», а затем предупредить меня о том, сколько строк убрать<td> с целевым классом.(в приведенном выше примере он возвращает 2).

В таблице могут быть другие элементы <td> с классом target.Меня интересует только количество строк до тех пор, пока цель next не окажется в той же строке, что и моя "clicked" td.Любые цели выше моего 'clicked' <td> или в других столбцах должны игнорироваться.

Если после выбранного элемента в той же строке нет других 'target' <td>, предупреждение должно быть прочитано«других целей нет».

Надеюсь, это понятно.

Ответы [ 2 ]

1 голос
/ 22 декабря 2011

Вы имеете в виду, как это?

var targetRowIndex = $('.target')[0].parentNode.rowIndex;

$(".click").bind("click",function(){
   alert( targetRowIndex - this.parentNode.rowIndex ); 
});

http://jsfiddle.net/BZDyr/3/

Вы, вероятно, сможете реализовать остальные точные функции самостоятельно, если поймете, что происходит в этом коде.

1 голос
/ 22 декабря 2011

вы, вероятно, могли бы найти решение, используя комбинацию parent () и closest () , вместе с братьями и сестрами, next, previous и т. Д., В основном используя методы обхода для выбора"td.target"

...