javascript - mousemove 目标元素返回不需要或正确的元素

Question

我有一组 svg 元素

<svg id="container_svg" style="width: 700px; height: 600px;>
<rect width='600' height='600'> </rect>
<g>
<path d="M  285 0 L 285 0 L 318.34499999999997 57.5055 L 251.655 57.5055 z"/>
</g>
</svg>

并将 mousemove 事件添加到 document.ready 中的 svg 元素

$("#container_svg").mousemove(function(evt){
  var child=$(evt.target)[0].nodeName;
 });

因此，在 svg 元素上移动，事件被触发，但在不同的浏览器中获得不同的目标元素，如下所示。即使在 svg 中移动路径元素，我在 Firefox 中将 $(evt.target)[0].nodeName 作为“rect”，但在 IE 和 chrome 中 $(evt.target)[0].nodeName 返回“path “如我所愿...

谢谢，

湿婆

Answer 1

跨浏览器解决方案：

  $("#container_svg *").mousemove(function(evt){
     //var child=$(evt.target)[0].nodeName;
     evt.stopPropagation();
     var child=$(evt.currentTarget)[0].nodeName;
   });

不知道您为什么对我的预览答案投了反对票...