Jquery mouseleve和mouseout触发频率过高

这里相对较新的编码器。我使用D3和jquery创建了一个跳跃效果，当光标移动到svg圆上时会触发该效果

圆的示例如下所示：

<circle cx="20.61855670103093" cy="730" class="top1000 Ragtime albumDot" id="0" r="5.5"></circle>

$('.albumDot').mouseenter(function() {
   console.log("mouseover"+ this.id); 
   hopup(jazzdata[this.id]);      
});
$(".albumDot").mouseleave( function() {
   console.log("mouseout"); 
   d3.select("#hopup").attr("style","display:none; opacity:0;");
}

处理悬停的代码如下所示：

<circle cx="20.61855670103093" cy="730" class="top1000 Ragtime albumDot" id="0" r="5.5"></circle>

$('.albumDot').mouseenter(function() {
   console.log("mouseover"+ this.id); 
   hopup(jazzdata[this.id]);      
});
$(".albumDot").mouseleave( function() {
   console.log("mouseout"); 
   d3.select("#hopup").attr("style","display:none; opacity:0;");
}

悬停功能工作得很好，但当我将鼠标移到这些svg形状上时，mouseenter和mouseleave会反复触发。我不是离开这个形状，只是在里面移动

以前，我一直在使用mouseover和mouseoff，但我有同样的问题。这些圆没有子元素

这发生在Mac上的Safari和Chrome中

编辑：这里是dropbox上的一个实时示例

---

在DOM中，您有一个元素

，它似乎没有被使用。这个元素一出现就出现在圆点的顶部，并从鼠标中窃取焦点。只需给它

display:none

就可以解决这个问题。所以，如果你不需要它，就扔掉它

如果你真的需要它——我猜你计划在里面放一个箭头——你需要确保它永远不会与点重叠。首先给这个元素一个

背景色：#f00

，这样你可以清楚地看到它的位置，然后调整它的高度和位置

---

最后，如果此元素必须与点重叠，则向其添加CSS属性

指针事件：none

，这将导致浏览器忽略其鼠标事件。不幸的是，这个属性在IE中不起作用，而且对于这个问题没有简单的解决方法——除了通过总是为IE浏览器隐藏这个元素来优雅地降低性能。

我认为您需要提供更多的上下文。可以提供一个链接到一个实例吗？它没有在个人电脑上测试过。