在画布上绘制DOM元素(SVG作为外部元素)在Internet Explorer中不起作用

Question

我已成功使用此技术,从画布上的DOM元素(如输入和选择字段)中绘制用户输入,并使其可用作图像.

这在Chrome,Safari和Firefox中运行良好,但在Internet Explorer 11上,我收到以下错误:

• XML5634:此元素上已存在具有相同名称的属性.行:1,第242列,当我尝试我已开发的完整网站时.假设在name和id字段上有重复值时会显示此错误但我检查了DOM上的每个元素并且没有.
• 意外调用方法或属性访问.,当我试图重现这个小提琴的整个过程: http: //jsfiddle.net/5mf4n7v3/ .从调试器看来,ctx.drawImage()调用时会发生错误 .

基本上,我试图在这个小提琴中做的是在画布上绘制SVG黄色圆圈图像和由我提供的任意SVG.这似乎适用于除IE11之外的所有主流浏览器.还有其他人遇到过同样的问题,并且知道一些解决方法吗？

Answer 1

IE 10不支持<foreignObject>标签，但你不需要它在画布上绘制文本，在这里我重写了你的小提琴，所以现在它可以在IE中工作 - http://jsfiddle.net/skyr9999/5hhpo76h