jQuery - 切换选定的项目

时间:2017-11-05 13:17:25

标签: jquery html-lists toggle nextuntil

我的jQuery任务有问题。我必须在点击标题后切换'ol'上下文:

我的HTML:

<h3>Task</h3>
    <ul>...</ul>
    <ol>...</ol>

<h3>Second Task</h3>
    ...

我的jQuery脚本:

$(document).ready(function() {
    $('h3').click(function() {
        $(this).nextUntil('h3').toggle(); 
    })
})

我的代码在h3标题之间切换所有上下文,但我只需要'ol'。 非常感谢您的帮助。

1 个答案:

答案 0 :(得分:2)

您可以使用.last()切换集合中的最后一个元素(在本例中为ol)。

更新:如果您应该在<ol>之后收到某些内容,最好使用.filter('ol')确保您只定位所需的列表。

$(document).ready(function() {
    $('h3').click(function() {
        $(this).nextUntil('h3').filter('ol').toggle(); 
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h3>Task</h3>
    <ul><li>list1-1</li><li>list1-2</li></ul>
    <ol><li>list2-1</li><li>list2-2</li></ol>

<h3>Second Task</h3>