停止ng mouseenter和ng mouseout在内部元素上触发

Stop ng-mouseenter and ng-mouseout from triggering on inner elements

本文关键字:ng 元素 mouseout mouseenter 停止 在内部      更新时间:2023-09-26

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

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

有两种选择:

  1. 在内部元素上使用CSS指针事件(但首先要检查目标浏览器对它的支持程度(。

  2. 改为使用ngMouseenter/ngMouseleave(有关mouseenter/mouseleve与mouseover/mouseout之间的不同行为,请参阅此plnkr(