How to make an svg object clickable

Question

When can I make the object clickable.

For example:

<object data="img/test.svg" type="image/svg+xml" />

When I add onclick it doesn't work.

Important notice: I need to have an object and not img, due to the fact that I'm making some manipulation to the svg once that it is loaded.

Answer 1

You could add click event programatically?

Like this:

<object id="svgId" data="img/test.svg" type="image/svg+xml" />

var el = document.getElementById("svgId").onclick=yourMethod;


yourMethod()
{
   // Your method which would do something when it's clicked?
}

Or a el .addEventListener("click", yourMethod, false);

Answer 2

document.getElementById("svg").addEventListener('click', doSomething);

function doSomething(e) {
  // code
}