Javascript jQuery关于ul上的函数及其内部的ul

我的导航结构如下

<ul class="parentul">
     <li class="has-dropdown">
           <a href="">Link title<span class="desc">Link desc</span></a>
          <ul class="dropdown">    
                <li class="title back">
                    <h5><a href="#">Back</a></h5>
                </li>
                <li>
                    <h5><a href="#">Option 1</a></h5>
                </li>
                <li>
                    <h5><a href="#">Option 2</a></h5>
                 </li>
           </ul>
     </li>
</ul>

我有一个用于li.has下拉列表的点击功能，可以将其滑出视图并将子ul带到视图中，但是我希望子li.back启动它，将其滑回并将原始导航带到视图中

我的问题是，如果子ul位于li.has下拉列表中，单击任何链接都会启动原始转换的行为

单击其中一个li.has下拉列表以将子ul滑入视图，并使li.back滑入子ul的最佳方式是什么

非常感谢您需要在

li.back

事件处理程序中使用

防止事件在DOM树中冒泡，防止任何父处理程序收到事件通知

代码

---

你能加一把小提琴吗？与

li.back一起使用你的解释没有多大帮助。请包括JS示例（您所做的）和/或@j08691 jQueryattached@RiderjQuery attachedPerfect，忘了这个。谢谢你的快速回复！
$('ul > li.has-dropdown').on('click', function(e){
    e.preventDefault();
    var $this = $(this);
    $this.addClass('moved');
    $('.parentul').animate({
        left: "-100%"
    });

}); 

$('ul > li.has-dropdown.moved > ul > li.back').on('click', function(e){
    e.preventDefault();
    var $this = $(this);
    $this.closest('.has-dropdown').removeClass('moved');
    $('.parentul').animate({
        left: "0"
    });
});

$('ul > li.has-dropdown.moved > ul > li.back').on('click', function(e){
    e.stopPropagation();

    var $this = $(this);
    $this.closest('.has-dropdown').removeClass('moved');
    $('.parentul').animate({
        left: "0"
    });
});