Javascript 单击时取消动画或单击时删除类

如何删除或取消动画，当我单击一个div时，它会打开第二个div，并带有一个子菜单，这很好，问题是我添加了一个子菜单，并在悬停时显示，但如果我单击悬停链接上的任何链接，它会打开第二个div…

<div class="togger">
   Nice Title
     <div class="sub-menu-hover">
       <a href="foo.html">Some page</a>
     </div>
</div>
<div class="hiden-menu">
   <a href="foo.html">Some page</a>
</div>

好标题

因此，当我点击“好标题”时，它会显示“.hiden”菜单，这很好，当我悬停在“好标题”时，它会显示“.sub-menu hover”也很好，问题是当我点击“.sub-menu hover”中的任何菜单“a”标记时。 它所做的是打开“.hiden”菜单，而我不希望这样…
我注意到，当我点击“.toggler”中的任何内容时，它会添加一个类“.active”，并打开“.hiden”菜单，那么当有人点击“.sub-menu hover”时，如何防止出现这种情况呢？它只会将您带到您单击的任何链接…
我这样做了

<script>
   (function($) {
        $(".sub-menu-hover").click(function(){
            $('.toggler').removeClass('active');
        })
    })(jQuery);
</script>

（函数（$）{
$（“.sub菜单悬停”）。单击（函数（）{
$（'.toggler'）.removeClass（'active'）；
})
})（jQuery）；

但是什么都没做…

$（“.togger p”）。单击（函数（）{
$（“.hiden菜单”）.toggle（）；
$（“.sub-menu hover”）.hide（）；
});
$（“.togger p”）.mouseover（函数（）{
$（“.sub-menu hover”）.show（）；
});
$（“.togger p”）.mouseout（函数（）{
$（“.sub-menu hover”）.hide（）；
});
。子菜单悬停，
.隐藏菜单{
显示：无；
}

好标题

请发布您正在使用的css