阻止ng-mouseenter和ng-mouseout触发内部元素

Question

我有一个无序列表,其中每个li是一个固定的小尺寸,但当你将鼠标悬停在它上面时,它将扩展到完整尺寸.这是通过ng-mouseover和ng-mouseout完成的.问题是某些li文本包含其他标记(例如),当鼠标进入标记时,它会触发mouseout事件并折叠li.

显然,当鼠标位于其中时,所需的行为是使li保持放大,即使它在子元素上也是如此.有没有人知道如何基本上忽略内部元素的鼠标悬停？如果它进入子元素,我还需要忽略li的mouseout.

Answer 1

有两种选择:

在内部元素上使用CSS 指针事件(但首先要检查目标浏览器支持它的程度).
请改用ngMouseenter/ngMouseleave(有关mouseenter/mouseleave与mouseover/mouseout之间的不同行为,请参阅此plnkr)

ng-mouseleave是关键,非常感谢.对于那些感兴趣的人,有一个关于mouseenter mouseleave和mouseover mouseout的好视频[博客](http://www.bennadel.com/blog/1805-jQuery-Events-MouseOver-MouseOut-vs-MouseEnter-MouseLeave.htm ). (4认同)