Question

我正在尝试将onClick处理程序添加到嵌入对象。处理程序需要执行一个函数，该函数位于外部.js文件中，该文件通过<script src="...链接到当前的html文件。

我是否需要以不同的方式引用该功能，因为它位于其他地方？

以下是目前的代码（不起作用，但也不会产生任何错误）：

<embed src="svg/button.svg" id="buttonEmbed" width="95" height="53" 
type="image/svg+xml" onClick="buttonEvent('buttonClicked')"/>

Answer 1

你必须在svg中实现onclick 并使用svg中的javascript将其链接到外部JavaScript函数。 ~~有关示例，请参阅SVG wiki。~~

更新：显然SVG wiki已不复存在。毫不奇怪，我现在（快速）找到的最佳参考资料都在StackOverflow本身上。

This answer describes how to implement onclick inside the svg

Answer 2

使用javascript绑定（ Mario Menger 已经回答）。

如果你不能或不会使用绑定，你可以使用 xil3 回答一次修改：

使用空锚标记<a href="javascript:someFunc()"></a>作为点击使用者。设置它的z-index和位置/大小，使其位于svg对象上（用于跨浏览器兼容性）。

Answer 3

如果您想从嵌入式对象中调用方法，则可以执行以下操作：将以下内容作为您的embedsrc.html：

    <img src="svg/button.svg" width="95" height="53" 
    onClick="window.parent.buttonEvent('buttonClicked')"/>

，然后将其放在您的主要html中：

    <embed src="embedsrc.html" width="95" height="53"> </embed>

    <script type='text/javascript'>
    function buttonEvent(input){alert(input);}
    </script>

Answer 4

Onclick应该都是小写的。

<embed src="svg/button.svg" id="buttonEmbed" width="95" height="53" 
type="image/svg+xml" onclick="alert('hello!');"/>

如何将JavaScript onClick处理程序添加到嵌入式html对象？

4 个答案: