jQuery在每个选项卡中选择第一个手风琴

我有一个使用jQuery选项卡的页面。每个选项卡都包含一个或多个jQuery手风琴，它们是动态生成的，除了其他内容。例如：jQuery在每个选项卡中选择第一个手风琴

<div id="tab1" class="tab"> 
    <div> 
     Some stuff 
    </div> 
    <div class="accordion"> 
     I am an accordion 
    </div> 
</div> 
<div id="tab2" class="tab"> 
    <div class="accordion"> 
     I am also an accordion 
    </div> 
    More stuff 
    <div class="accordion"> 
     I am also an accordion 
    </div> 
</div>

我希望每个选项卡中的第一个手风琴保持打开状态，而其他（如果有的话）折叠。我曾尝试过：

$('.tab .accordion:first')

其中只显示页面上的第一个手风琴（显然）。我也试过：

$('.tab .accordion:first-child')

这将选择在TAB2第一手风琴，但它没有选择，因为有上面的一些东西之一，TAB1。我也试过：

$('.tab > .accordion').filter(':first-child') 
$('.tab').children('.accordion:first-child')

除了我能想到的选择器的每个组合。此时我的大脑被炸了。你点我到重复的问题之前，这些都不是问同样的问题正是：

JQuery Tab each Selected tab first text box focus

jquery select first child with class of a parent with class

jQuery selector for each first element on every parent

jQuery Selecting the first child with a specific attribute

在我的情况不同的是我几乎不能控制这些标签中显示的内容。

来源

2013-02-16 Dave Kennedy

如何$（ '标签 '）每个（函数（）{VAR firstAcc = $（本）.find（' 手风琴。'）EQ（0）; }）？ – gaurav 2013-02-16 00:15:51

废话...我一问就找到了答案。 '$（'。accordion：first-of-type'）'这是免费赠品。 – 2013-02-16 00:19:47

实际上，'：first-of-type' _doesn't_不在我上面提供的例子中工作，因为它匹配第一个div元素，而不是第一个带有手风琴类的元素。请参阅下面的David Thomas的回答。 – 2013-02-16 00:58:36

我建议：

$('.tab').find('.accordion:first');

JS Fiddle proof-of-concept。

来源

2013-02-16 00:19:06

工程很棒。我会用这个，但是我喜欢'：first-of-type'的优雅:) – 2013-02-16 00:27:54

你知道你可以回答你自己的问题，对吗？如果您想使用不同的答案，或者找到更适合您需求的不同答案，您不必接受其他人发布的答案，只需回答自己的问题并接受答案即可！（虽然，无可否认，你必须等待两天才能接受，但即使如此......） – 2013-02-16 00:31:28

是的，但那样会浪费。有人可能会得到它的代表。不是你需要的;） – 2013-02-16 00:37:20

试试这个：

$('.accordion:first', '.tab')

来源

2013-02-16 00:19:24

这会选择第一个手风琴以及每个选项卡。 – 2013-02-16 00:21:24

它不应该，它被写入的方式应该在'.accordion：first'元素的'.tab'（上下文）中查找。这种方法是有效的，但是在内部，它会将其切换到使用我自己的答案中的语法。 – 2013-02-16 08:14:34

jQuery在每个选项卡中选择第一个手风琴

回答

相关问题