0

我有一个像这样的 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。它阻止了那里的点击事件。

4

0 回答 0