$(document).on("mousemove",function(e){if(del_Curve.has_del_curve){ var del_icon_width=$("#del-curve-icon").width(); var del_icon_height=$("#del-curve-icon").height() //判定当前光标位置,若不在剪刀图表区域内则恢复默认样式 if(e.pageX<del_Curve.xAxis || e.pageX>(del_Curve.xAxis+del_icon_width) || e.pageY<del_Curve.yAxis || e.pageY>(del_Curve.yAxis+del_icon_height)){ del_Curve.has_del_curve=false; $("svg .node").each(function(){ this.setAttribute("opacity","1"); }); $.each(relation.links,function(l,link){ var in_node_id=link.input.nodeId; var out_node_id=link.output.nodeId; $("#"+out_node_id+link.output.pointName+in_node_id+link.input.pointName)[0].setAttribute("opacity","1"); $("#"+out_node_id+link.output.pointName+in_node_id+link.input.pointName).attr("class","curve"); }); $(del_Curve.ref_Curve).attr("class","curve"); var in_node=$("#"+$(del_Curve.ref_Curve).attr("start")).children("g").eq(0).children("circle").eq(1); in_node.attr("class",in_node.attr("class").replace("node-hover","").trim()); var out_node=$("#"+$(del_Curve.ref_Curve).attr("end")).children("g").eq(0).children("circle").eq(1); out_node.attr("class",out_node.attr("class").replace("node-hover","").trim()); $("#del-curve-icon").hide(); } } })
okay,其实工作流的问题，如果单单只是高亮曲线，mouseenter和mouseleave的效果就足够了。不过示例中，需要在曲线上覆盖一个剪刀图标，这就会跟原来曲线的mouseenter和mouseleave有冲突。因为删除曲线的触发元素是剪刀图标。
您可能感兴趣的文章: