Теперь я реализую что-то вроде этого сообщения (в частности, эффект имеет место при щелчке строки)
Как узнать, что индекс строки находится внутри таблицы?
Теперь я реализую что-то вроде этого сообщения (в частности, эффект имеет место при щелчке строки)
Как узнать, что индекс строки находится внутри таблицы?
Если вы определили обработчик кликов непосредственно на элементах tr
, вы можете использовать метод index
следующим образом:
$('#tableId tr').click(function () {
var rowIndex = $('#tableId tr').index(this); //index relative to the #tableId rows
});
Если событие click привязано не непосредственно к элементу tr
(если вы используете якорь, кнопку и т.д.), вы должны найти ближайший tr
, чтобы получить нужный индекс:
$(selector).click(function () {
var rowIndex = $('#tableId tr').index($(this).closest('tr'));
return false;
});
Попробуйте пример здесь.
Чтобы ответить на свой первый вопрос:
$("#id tr").click(function() {
alert($("#id tr").index(this));
});
Если вы просто выполните:
$("table tr").index(this);
и у вас на странице несколько таблиц, вы получите ошибочный результат.
При этом вам не нужно знать индекс для перемещения строк вверх и вниз в таблице. Например:
<table id="foo">
<tr>
<td><a href="#" class="up">Up</a> <a href="#" class="down">down</a></td>
<td>First row</td>
</tr>
<tr>
<td><a href="#" class="up">Up</a> <a href="#" class="down">down</a></td>
<td>Second row</td>
</tr>
<tr>
<td><a href="#" class="up">Up</a> <a href="#" class="down">down</a></td>
<td>Third row</td>
</tr>
</table>
с чем-то вроде:
$("a.up").click(function() {
var row = $(this).closest("tr");
if (row.prev().length > 0) {
row.insertBefore(row.prev());
}
return false;
});
$("a.down").click(function() {
var row = $(this).closest("tr");
if (row.next().length > 0) {
row.insertAfter(row.next());
}
return false;
});
Это должно работать:
$('#tableId tr').click(function () {
var index = $(this).siblings('tr').index(this);
});
Вам не нужно tr
в вызове siblings
, если вы уверены, что ваш html будет правильно сформирован.