2

嗨，我正在尝试定位<a>.current-cat-parent 下的第一个元素，但我的 jquery 代码正在影响其<a>下的所有元素。我怎样才能只针对第一个直接<a>元素？谢谢！

$(".current-cat-parent a:first-child").click(function(e){
            e.preventDefault();
          if( $(this).hasClass('hide') ){
            $(this).next().slideDown(800);
            $(this).removeClass('hide');
          } else { 
            $(this).next().slideUp(800);
            $(this).addClass('hide');
          }
    });

<li class="cat-item cat-item-1 current-cat-parent">
  <a title="View all posts filed under Clothing" href="http://site.com/category/clothing">Clothing</a>
  <ul class="children">
    <li class="cat-item cat-item-3"><a title="View all posts filed under Jeans" href="http://site.com/category/clothing/jeans">Jeans</a></li>
    <li class="cat-item cat-item-2 current-cat"><a title="View all posts filed under Suits" href="http://site.com/category/clothing/suits">Suits</a></li>
  </ul>
</li>
4

4 回答 4

2

您可以使用eq()来定位第一个孩子。

$(".current-cat-parent a:eq(0)")
于 2013-04-03T09:26:44.037 回答
2

而不是这个：

$(".current-cat-parent a:first-child")

使用直接孩子>：

$(".current-cat-parent > a:first-child")

笔记：

我认为你的主要问题是.hidecss类。为什么你需要它？我建议您将其设为空白 CSS 类或将其删除。

小提琴

于 2013-04-03T09:29:16.330 回答
1

它应该是

$(".current-cat-parent a:eq(0)").click(function(e){
于 2013-04-03T09:26:15.993 回答
1

如果您仔细查看 HTML 标记，您会注意到所有a元素也first-child属于它们各自的父级。解决方案是使用以下选择器之一：

.current-cat-parent > a
.current-cat-parent a:first
.current-cat-parent a:eq(0)

注意:first和:first-child不一样。

于 2013-04-03T09:28:44.853 回答