我有一个像这样的 svg 元素,
<svg class="makeStyles-timeline-17" width="100%" height="1920" overflow="auto">
<foreignObject position="absolute" width="100%" height="1920" pointer-events="all">
<div>
<div id="timelineRow_0" data-index="0" data-time="Wed Dec 09 2020 00:00:00 GMT+0600 (Bangladesh Standard Time)" style="height: 20px;"></div>
</div>
</foreignObject>
<foreignObject position="absolute" width="100%" height="1920" pointer-events="all">
<div style="height: 20px"> Test</div>
</foreignObject>
</svg>
两个foreignObject 中的子元素都有点击事件。foreignObjects 相互重叠。我的问题是当我点击那个div时,最后一个foreignObject的孩子的点击事件工作正常。但是,即使最后一个 foreignObject 的 div 没有与第一个 foreignObject 的 div 重叠,第一个 foreignObject 的孩子也不会触发 click 事件。简而言之,点击事件不会通过顶部的foreignObject。它阻止了那里的点击事件。