jquery - 使用 jquery 关闭可折叠菜单

Question

我试图在使用 jquery 单击时关闭可折叠菜单的内容。下面我附上了 fiddle 以供引用。

<div id="advent">
    <i id="arrow" class="fa fa-plus-circle" style="margin-left:40px"></i>
    Advent
    <div id="expand" style="display:none">Content</div>
</div>

<script>
    $('#advent').click(function () {
        $("#arrow", this).toggleClass("fa-minus-circle");
        $('#expand').show();
        if($this.hasClass()){
            $('#expand').slideUp();
        }
    });
</script>

https://jsfiddle.net/5trqxn6t/3/

Answer 1

只需使用 toggle 或 slideToggle

$('#advent').click(function () {
    $("#arrow", this).toggleClass("fa-minus-circle");
    $('#expand').slideToggle();
});

https://jsfiddle.net/5trqxn6t/5/