1

我遇到了 Chrome 和 foreignObject 的问题，我想将它放在一个 SVG 元素中，该元素是另一个 SVG 元素的子元素，由于某种原因，chrome 似乎不喜欢这样。我是否在语法中遗漏了某些内容，或者是时候提交错误报告了吗？

例子：

<svg width="400" height="600" xmlns="http://www.w3.org/2000/svg" version="1.1">
    <foreignObject x="0" y="0" width="400" height="200" overflow="hidden" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="pointer-events: all;">
        <div contenteditable="true" xmlns="http://www.w3.org/1999/xhtml" style="background: black; color: white;">
            <div>This works!</div>
        </div>
        <textarea>Here we can select text</textarea>
    </foreignObject>
    <svg x="0" y="200" xmlns="http://www.w3.org/2000/svg" version="1.1">
        <foreignObject x="0" y="0" width="400" height="200" overflow="hidden" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="pointer-events: all;">
          <div contenteditable="true" xmlns="http://www.w3.org/1999/xhtml" style="background: black; color: white;">
            <div>But this does not in chrome, why not?</div>
          </div>
          <textarea>Unable to select text, but it's posible to edit</textarea>
        </foreignObject>
    </svg>
</svg>

JSFiddle 示例

4

0 回答 0