我正在尝试将单击事件添加到SVG元素中,该元素具有可见溢出和其中溢出SVG的形状元素(圆/路径).
在Safari(9,10,11)上,单击事件在形状元素(圆/路径)溢出的区域中不起作用,而它在SVG中存在的区域中正常工作.
var count = 0;
function clickMe() {
console.log("in click func");
count++;
document.getElementById("counter").innerHTML = count;
}#counter {
font-size: 2em;
}
#starSvg {
pointer-events: auto;
overflow: visible;
position: absolute;
left: 200px;
top: 250px;
border: 1px solid red;
}
#starPolygon {
overflow: visible;
fill: rgba(0, 153, 219, 1);
pointer-events: visiblePainted;
stroke-width: 4;
stroke-linecap: square;
stroke-linejoin: round;
stroke: rgba(219, 0, 153, 1);
cursor: pointer;
shape-rendering: geometricPrecision
}
p {
margin: 10px 0;
}<div>
<p>Open this webpage on Chrome & safari</p> …