麻烦遍历DOM

我有一些HTML，看起来像这麻烦遍历DOM

<dl class="dropdown"> 
    <dt><span>Gender</span><a href="">Go</a></dt> 
    <dd class="shadow_50"> 
     <ul> 
      <li><a href="#"><span class="option">male</span><span class="value">1</span></a></li> 
      <li><a href="#"><span class="option">female</span><span class="value">2</span></a></li> 
     </ul> 
    </dd> 
</dl>

的DD被设置为隐藏GO链接被点击时，我有一些代码，滑动DD向下或向上。但我的问题是，当我有多个实例，如果这些在一个页面中，一次点击打开页面上的所有DD，我如何定位最接近点击的DD，

我试过以下，

$(".dropdown dt a").click(function(e) { 
    $(this).closest("dd").slideToggle(defaults.speed); 
e.preventDefault(); 
});

而且这一点，

$(".dropdown dt a").click(function(e) { 
    $(this).next("dd").slideToggle(defaults.speed); 
    e.preventDefault(); 
});

我没有成功尚未虽然。

来源

2011-10-03 Udders

你试过：

$(".dropdown dt a").click(function(e) { 
    $(this).closest("dl").find("dd").slideToggle(defaults.speed); 
    e.preventDefault(); 
});

Youc't使用next（），因为你的链接只有一个SPAN作为同级因为它只是走到树不能使用最接近

来源

2011-10-03 08:41:37

尝试;

$(this).parent().siblings("dd").slideToggle(defaults.speed);

来源

2011-10-03 08:42:18 graphicdivine

您有正确的想法，但您尝试过的方法并不像您所期望的那样工作。最简单的方法可能会去到父，然后找到相应的元素：

$(this).parent().next().slideToggle(defaults.speed);

你的尝试失败，原因如下：

.closest遍历DOM（它看起来向上，所以检查父母，然后是所有更远的祖先，直到找到匹配）。在你的情况下，所需的元素不是this的祖先，所以这是行不通的。

.next获取当前匹配元素的下面的兄弟。在你的情况下，因为a是dt中的最后一个元素，所以没有以下兄弟姐妹。

需要注意的是，如果你的DOM结构很可能会改变您可能需要使用closest到达dl元素，然后用.find找到dd（见@Nicola Peluchetti的答案）。

来源

2011-10-03 08:43:17

麻烦遍历DOM

回答

相关问题