我试图找到<td>
中<tr>
的顺序。我有这样的表结构
<table>
<tbody>
<tr>
<th> Name </th>
<th> Edit </th>
<th> Delete </th>
<tr>
<tr>
<td> Tom </td>
<td> <i class="icon icon_edit"></i> </td>
<td> <i class="icon icon_remove"></i> </td>
<tr>
<tbody>
</table>
我必须使用<th> Edit </th>
找到表格标题<i class="icon icon_edit">
。我试图使用parents()找到它,但仍然没有任何方法来找到行中父<td>
的位置。
我的逻辑是这样的
parentTD = $('.icon_edit').parents('td')
positionOfparentTD = 2 //Which i dont know how to
correspondingHeader = $("table th:eq(2)")
我如何在jQuery中实现它?
答案 0 :(得分:3)
jQuery有index()
方法,它基于零,但eq()
var parentTD = $('.icon_edit').closest('td')
var positionOfparentTD = parentTD.index(); // 1
var correspondingHeader = $("table th:eq("+positionOfparentTD+")")
答案 1 :(得分:1)
var tdIndex=$('.icon_edit').parent('td').index();
$("table th:eq('"+ tdIndex+"')");
答案 2 :(得分:1)
尝试使用.index()我建议您使用.closest()代替.parents(),
parentTD = $('.icon_edit').closest('td');
positionOfparentTD = parentTD.index();
correspondingHeader = $("table th:eq("+ positionOfparentTD +")")
答案 3 :(得分:0)
我宁愿在标题上使用一个类,因为如果你某天更改列的顺序,你的Javascript可能会忘记更新,因此不再适用。
以下是我要做的事情:
<table>
<thead>
<tr>
<th>Name</th>
<th class="edit-header">Edit</th>
<th>Delete</th>
<tr>
</thead>
<tbody>
<tr>
<td>Tom</td>
<td class="edit"><i class="icon icon_edit"></i></td>
<td><i class="icon icon_remove"></i></td>
<tr>
<tbody>
</table>
然后用jQuery做到这一点:
var $editHeader = $('.edit').parents('thead').find('.edit-header');
我在编辑单元格中添加了edit
类,因为图标类名称也可能会更改。