Jquery切换或隐藏/显示按顺序在其他父项上链接的元素?

时间:2016-12-01 21:44:20

标签: javascript jquery css

我们,让我开始,如果你在其他帖子或参考上看到我的问题重定向我。我找不到任何与我有关的问题。

我的问题是我想将一个孩子的动作与另一个孩子的孩子联系起来,如下所示:

<div class="parent1">
 <i class="link1"></i>
 <i class="link2"></i>
 <i class="link3"></i>
</div>

<div class="parent2">
 <div class="logo-case"></div>
 <div class="logo-case"></div>
 <div class="logo-case"></div>
</div>

我知道js不对(呃),但我想说明一下我想要完成的事情。

$('.parent1 i').each(function() {
    $(this).click(function(){
     $('**all** .logo-case').css("height", "0");
     $(' **this** .logo-case').css("height", "100%");
    )};
});

现在我想要第一个“i.link1”为第一个“徽标案例”提供高度,无论添加到“logo-case”的类,这意味着“link1”总是影响第一个“徽标案例”等等。

提前感谢您的回复。

1 个答案:

答案 0 :(得分:1)

看看这个小提琴:https://jsfiddle.net/6jaj5L0y/1/

我认为它实现了你想要做的事情。

$('.parent1 i').each(function(idx, el) {
    $(this).click(function(){
        $(".parent2 .logo-case").css({height: '0px'})
                                .eq(idx).css({height: '100px'});
  });
});