I got this SVG image from Wikipedia and embedded it into a website using this code:
It is possible to respond to events from embed
elements now, under the condition that you embed something from the same domain. I have created a quick demonstration of this as a JSFiddle. The most important part is that it is possible to access the embedded document through embeddingElement.contentDocument
. From there, the SVG element can be accessed and click event handlers can be installed.
Implementation note: in the demo, I add event handlers to all path
elements. For performance reasons, you would probably want to add a single event handler to the SVG and then use the event target in the handler. Edit: like in this updated Fiddle.
A quick Google search brought me here. I think that's the answer to your problem, right?
To summarize here: it is not possible to capture events on an embed
element, unfortunately the only solution is modifying the SVG file.
Here is a small example of how to embed JavaScript into an SVG file (JSFiddle). It is based on an example from IBM developerWorks.