JavaScript OnClickハンドラーを埋め込みHTMLオブジェクトに追加する方法は？

Question

埋め込みオブジェクトにオンクリックハンドラーを追加しようとしています。ハンドラーは、現在のHTMLファイルにリンクされている外部.JSファイルにある関数を実行する必要があります <script src="....

他の場所にあるため、関数を異なる方法で参照する必要がありますか？

現在のコードは次のとおりです（機能しませんが、エラーも発生しません）：

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

Answer 1

オンクリックを実装する必要があります 中身 SVGは、SVG内のJavaScriptを使用して外部JavaScript関数にリンクします。 例については、svg wikiを参照してください。

更新：どうやらSVG Wikiはもうありません。私が今（すばやく）できる最高の参照がStackoverflow自体にあることに驚くことではありません。

この答えは、SVG内にオンクリックを実装する方法を説明しています.

Answer 2

JavaScriptバインディングのいずれかを使用します（マリオ・メンガー すでにそれに答えた）。

バインディングができない、または使用しない場合は、何を使用できますか xil3 1つの変更で答えました：

空のアンカータグを使用します <a href="javascript:someFunc()"></a> クリックコンシューマーとして。 Z-Indexと位置/サイズを設定して、SVGオブジェクトの上に配置されます（クロスブラウザー互換性の場合）。

Answer 3

OnClickはすべて小文字である必要があります。

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