重叠元素组的SVG onmouseover发生两次 [英] SVG onmouseover for group with overlapping elements occurs twice

问题描述

将函数附加到SVG组的 onmouseover 事件< g> ...< / g> ，事件发生一次，每次指针进入组中的元素。

即使组中的两个元素在另一个元素中显示，也会发生。

例如：

 
 + ----- + 
 | A ___ | 
 | | B | 
 | __ | __ | 
 

当指针进入 A 矩形时，从那里移动到 B 矩形，不离开 A ，触发 onmouseover 事件包含 A 和 B 的组 G / p>

事件只发生一次，所以我不认为它与事件冒泡有关。

我预计集团被视为一个坚实的块，所以我不必担心其后代设置自己的事件。

任何解决？我正在做这个吗？有一个更好的方法吗？

解决方案

听起来很熟悉，我觉得冒泡会在这种情况下咬你。 b
$ b

2008年我的一个SVG Open演示文稿中的一些例子，特别是幻灯片17 应该是感兴趣的。可能是像mouseenter/mouseleave这样的事情会解决这个问题，但是它们还没有在w3c的推荐中。

编辑： 要清楚 mouseenter 和 mouseleave 在 DOM 3级事件工作草案。

When attaching a function to the onmouseover event for an SVG group <g>...</g>, the event occurs once, each time the pointer enters to an element in the group.

This occurs even if two elements in the group appears one inside another.

For example:

+-----+
|A ___|
|  |B |
|__|__|

When the pointer enters the A rectangle, and from there moves to the B rectangle without leaving A, the onmouseover events is triggered for the group G which contains both A and B.

The event occurs only once, so I don't think it relates to events bubbling.

I expected the group to to be treated as a solid block, so that I won't have to worry about its descendants when setting its own events.

Any work-around? Am I doing that correctly? Is there a better way?

解决方案

Sounds familiar, I think the bubbling will bite you in such cases.

Some examples from one of my SVG Open presentations in 2008, in particular slide 17 should be of interest. It might be that having something like 'mouseenter'/'mouseleave' events would solve this, but they're not yet in a w3c recommendation.

Edit: To be clear mouseenter and mouseleave are in the DOM Level 3 Events working draft.

这篇关于重叠元素组的SVG onmouseover发生两次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！