标签：jquery javascript svg raphael mouseevent

我正在使用Raphael js框架在客户端上创建交互式svg图像：

var paper = Raphael(document.getElementById("svgcontainer"));
var path = paper.path("M0,0 L150,0 L150,150, L0,150 Z");

path.attr({fill: 'red'});

var text = paper.text(40,20, "some text");

path.mouseover(function(){this.attr({fill: 'green'})});
path.mouseout(function(){this.attr({fill: 'red'})});

请查看jsfiddle示例http://jsfiddle.net/6BtUk/9/

如果用户将鼠标移到path元素内的文本上,则path元素将触发mouseout事件.当用户将鼠标移动到文本元素时,如何防止在路径元素上触发mouseout事件？

解决方法:

我没有和Raphael合作,但看起来你可以尝试使用Set对你的标签和矩形进行分组并将事件处理程序附加到集合中.

jsfiddle

这是另一个类似于你的问题

Raphael JS : mouseover/mouseout – problem with text-labels

标签：jquery,javascript,svg,raphael,mouseevent
来源： https://codeday.me/bug/20190626/1292666.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。