Javascript 父项也可以切换子项

我使用jQueryUISortable创建了这个可排序的项目列表，它还可以嵌套项目

每个项目都包含可切换的内容，单击项目时会向下滑动。但是，当嵌套时单击父项时，它不仅切换父项内容，还切换子项内容

我一直试图在Jquery脚本中找到答案，但一直没有找到答案。。我在这把小提琴上复制了我的问题：

还有HTML：

<ol class="sortable panel-group">
  <li class="panel panel-default">
    <div class="toggle">Home</div>
    <div class="panel-content">Hidden content</div>
  </li>
  <li class="panel panel-default">
    <div class="toggle">About us</div>
    <div class="panel-content">Hidden content</div>
  </li>
  <li class="panel panel-default">
    <div class="toggle">Contact</div>
    <div class="panel-content">Hidden content</div>
  </li>
</ol>

---

您需要首先使用

is（'：visible'）

---

你应该在你的问题中发布相关代码，而不是提供外部链接谢谢你让我知道，更新了它。Mm，仍然产生相同的问题。父项和子项有切换问题。@Grek Json我不明白你的意思。如果单击Home，您希望发生什么首先您必须拖动一个项目以嵌套在另一个项目下。然后，当单击父项以显示其隐藏内容时，它也会显示来自子项的内容。。这是不必要的。没有人能帮我解决这个问题吗？

$(document).ready(function () {

$('.sortable').nestedSortable({
  handle: 'div',
  items: 'li',
  toleranceElement: '> div'
});


  $(".panel-default").click(function () {
    event.stopImmediatePropagation();
    $(".panel-content").not($(this)).slideUp();

    $(this).find(".panel-content").slideDown();
  });

});

$(document).ready(function () {
$('.sortable').nestedSortable({
                handle: 'div',
                items: 'li',
                toleranceElement: '> div'
              });


            $(".panel-default").click(function () {
                event.stopImmediatePropagation();
                $(".panel-content").not($(this)).slideUp();
                let x = $(this).find(".panel-content");
                if(!x.is(':visible')) x.slideDown();
            });
        });