为什么我的jQuery不能正常工作？

Question

我想知道是否有人能够完成这一项工作，因为我现在已经尝试了40分钟，这应该不会那么困难。

我有一些嵌套的div像这样：

<div> 
<div> 
Some info - <a href='#' class='slick-toggle'>[more info]</a> 
    <div class='slickbox'> 
     <div> 
     More Content... 
      <a href='#' class='slick-toggle2'>see full XML reply</a><br /> 
      <div class='slickbox2'> 
        <div class='xmlOutput'> 
         more content from XML source 
        </div> 
      </div> 
     </div> 
    </div> 
</div> 

现在我希望发生的是与类“油滑切换”的链接被点击的股利与类“slickbox时“隐藏或显示。在这个div中，当点击它时，我有类“slick-toggle2”的其他链接。我希望隐藏或显示类“slickbox2”的div（当页面被加载时，这两个div都被隐藏）。所以如果显示“slick-toggle”，你只能切换“slick-toggle2”。这应该很容易，但切换只适用于第一个DIV。任何人都可以看到我的jQuery有什么问题

$(document).ready(function() { 

     $('.slickbox').hide(); 
     $('.slickbox2').hide(); 

     $('a.slick-toggle2').click(function() { 

      $(this).next("div.slickbox2").toggle(400); 
      return false; 
     }); 

     $('a.slick-toggle').click(function() { 

      $(this).next("div.slickbox").toggle(400); 
      return false; 
     }); 

    }); 

任何人都可以看到我要去哪里错了吗？我想我疯了？

请注意，我已经从超链接中取出A代码，因为它被阻止了吗？

Answer 1

这是因为非常下一个元素是<br />，所以不是这样的：

$(this).next("div.slickbox2").toggle(400); 

你需要这样的：

$(this).nextAll("div.slickbox2:first").toggle(400); 

.next()得到非常下一个元素只有如果它匹配选择器。 .nextAll()通过所有以下兄弟姐妹，你会得到匹配的:first。