我需要在 SVG Canvas 中放置一个按钮标签，有什么办法吗？ (我正在使用拉斐尔 JS)
我知道我可以在 svg Canvas 内“绘制”一个按钮并编写 onclick 事件代码，但我想保留浏览器按钮的原生外观和感觉。谢谢你。
最佳答案
可以在 SVG 中使用 HTML 按钮，使用 SVG foreignObject 元素:http://www.w3.org/TR/SVG/extend.html#ForeignObjectElement
规范中包含如何使用它的示例。
不幸的是，我不确定如何最好地使用 raphaeljs 中的 foreignObject。我相信 foreignObject 不会作为 RapahelJS API 的一部分公开。这样做的原因是可能没有一种干净的方法可以在 IE 上使用 VML 实现相同的目标。然而，raphaeljs 确实使访问其对象的底层原生 SVG DOM 节点变得相当容易，因此如果 IE 兼容性对于您的应用程序不是必需的，那么使用常规 SVG DOM API 来使用 foreignObject 应该相当容易。例如，您可以执行以下操作:
var paper = Raphael("canvas", 640, 480);
var svgRoot = paper.canvas; //everywhere except IE, this is an SVGSVGElement
var fo = document.createElementNS(paper.svgns,"foreignObject")
svgRoot.appendChild(fo);
//then add your HTML DOM nodes to fo here using regular HTML DOM...
关于javascript - svg Canvas 内的原生按钮标签，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4118769/