javascript - SVG onclick 事件在 iOS 设备上未触发

标签 javascript ios svg onclick

我有一个带有 rect 子元素的 SVG。矩形子元素有一个 onclick 事件，该事件通过 ID 获取另一个元素并更改其背景颜色。这适用于我桌面上的 Chrome 以及 Chrome 检查器中的 iOS 模拟器。但是，它不会在 iOS 设备上触发该事件。

我可以对代码进行哪些更改才能在桌面和 iOS 设备上运行？我应该监听其他事件吗？

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" style="height: 200px; width: 200px; border: 4px dashed salmon;">
    <rect x="25" y="25" height="50" width="50" style="cursor: pointer; fill: gold;" onclick="getElementById('box').style.backgroundColor = 'gold';"></rect>
</svg>
<div id="box" style="height: 200px; width: 200px; background-color: skyblue;"></div>

这是一个CodePen .

最佳答案

是的，很遗憾，iOS 中存在一个错误 - “click”和“tap”事件在 svg 标签中不起作用。

但您可以使用“touchstart”/“touchend”事件 - 它们在 iOS 中与 svg 配合使用效果很好。

您可以模拟“点击”事件: https://stackoverflow.com/a/32120668/3265404

关于javascript - SVG onclick 事件在 iOS 设备上未触发，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55386979/