Question

我现在正在实现类似this post的内容（具体来说，点击行时会产生效果）

如何知道表中的行索引是什么？

Answer 1

如果您直接在tr元素上定义了点击处理程序，则可以使用index方法，如下所示：

$('#tableId tr').click(function () {
  var rowIndex = $('#tableId tr').index(this); //index relative to the #tableId rows
});

如果点击事件不直接绑定在tr元素上（如果您使用的是锚点，按钮等...），您应找到最接近的tr以获得正确的指数：

$(selector).click(function () {
  var rowIndex = $('#tableId tr').index($(this).closest('tr'));

  return false;
});

试一个例子here。

Answer 2

回答你的第一个问题：

$("#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;
});

Answer 3

这应该有效：

$('#tableId tr').click(function () {
    var index = $(this).siblings('tr').index(this);
});

如果您确定自己的html格式正确，则在tr的调用中不需要siblings。

如何用jQuery知道内部的索引？<table> </table>

3 个答案: