Javascript 使用slideToggle（）使容器内的链接起作用

我有这个标记：

<ul><li id="link-notifications">
  <ul class="list-notifications" style="display:none">
    <li><a href="/link/to">Item 1</a></li>
  </ul>
</li>
</ul>

但每当列表向下滑动，我点击链接，列表就会向上滑动。我听说stopPropagation有效，所以我添加了它，但它不起作用。我甚至尝试将它添加到slideToggle回调，但它只是停止了slideUp操作。有什么想法吗？

HTML

<ul>
    <li id="link-notifications">
    <a href="#">link-notifications</a>
        <ul class="list-notifications">
            <li><a href="#">Item 1</a></li>
        </ul>
    </li>
</ul>​

我不是将活动附加到我想要滑动的对象的父对象，而是一个兄弟姐妹。这可以防止奇怪的事件冒泡

---

Fiddle:

您不需要在该事件中使用

e.stopPropagation（）

，只需单击链接即可

加上

$('.list-notifications').click(function(e){
    e.stopPropagation();
});

---

绑定

单击

事件仅链接通知其内部内容

$('#link-notifications, :not("#link-notifications > *")').click(function(e){
   e.stopPropagation();           
   $(this).find('.list-notifications').slideToggle('medium');       
});

$('.list-notifications').click(function(e){
    e.stopPropagation();
});

$('#link-notifications, :not("#link-notifications > *")').click(function(e){
   e.stopPropagation();           
   $(this).find('.list-notifications').slideToggle('medium');       
});