这是我的HTML
<table>
<tbody>
<tr id="taskID-1">
<td>
<a href="#" class="edit">edit</a>
</td>
<td data-field="complete">
<input type="checkbox" name="tasks" id="checkID-1">
</td>
<td data-field="description" colspan="100">
<label for="checkID-1">Description of task numero uno.</label>
</td>
</tr>
<tr id="taskID-2">
<td>
<a href="#" class="edit">edit</a>
</td>
<td data-field="completed">
<input type="checkbox" name="tasks" id="checkID-2" value="Description of task number 2" checked="checked">
</td>
<td data-field="description" colspan="100">
<label for="checkID-2" class="line-through">Description of task number 2.</label>
</td>
</tr>
<tr class="add">
<td colspan="100">
<a href="#">add task</a>
</td>
</tr>
<tr class="editRow">
<td>
<a href="#" class="cancel">cancel</a>
</td>
<td> </td>
<td>
<input type="text" class="description">
</td>
<td>
<menu class="saveButtons">
<a href="#" class="save close">save</a>
<a href="#" class="delete">delete</a>
</menu>
</td>
</tr>
</tbody>
</table>
这是我的jQuery:
$('.add a').live('click', function() {
// hide the .add row and show the .editRow
$(this).closest('table').children('.edit').hide();
$(this).closest('table').children('.add').hide();
$(this).closest('table').children('.editRow').fadeIn();
return false;
});
答案 0 :(得分:4)
因为table
的唯一孩子是tbody
,并且它既没有课程edit
也没有add
或editRow
。您可能希望使用find
代替:
$(this).closest('table').find('.edit').hide();
$(this).closest('table').find('.add').hide();
$(this).closest('table').find('.editRow').fadeIn();
但是因为我不知道你真正想要实现什么,所以我不能说这是否正在做你想做的事情;)