Question

我有这个功能：

$("span.expandimg").click(function(){
  $(this).nextAll(".toggle_container:first").slideToggle("slow");
});

这适用于：

<span class="expandimg"><a href="#"><img id="iexpand" src="images/expand.png" border="0" /><img id="icollapse" src="images/collapse.png" border="0" /></a></span>&nbsp;<a href="asdfa" class="DSF">First Link</a>

<div class="toggle_container">
Some Text
</div>

但现在我将“expandimg”放在表格列中，将“toggle_container”放在另一列中。像这样：

<tr>
  <td><span class="expandimg">......</td>
  <td><div class="toggle_container">.....</td>
<tr>

如何找到“toggle_container”元素？我想点击“expandimg”来扩展“toggle_container”，但它不能用我的功能。

谢谢！

Answer 1

$("span.expandimg").click(function(){
    $(this)
        .closest("tr")
        .find("td .toggle_container")
        .slideToggle("slow");
});

Answer 2

使用您目前拥有的HTML应该可以使用 -

$("span.expandimg").click(function(){
  $(this).parent().siblings().find(".toggle_container:first").slideToggle("slow");
});

演示 - http://jsfiddle.net/QAkKP/

Answer 3

$("span.expandimg").click(function(){
  $(this).parents("tr").find(".toggle_container").slideToggle("slow");
});

转到父TR元素，搜索.toggle_container。

应该工作：）

JQuery查找表行内的下一个元素

3 个答案: