Получение событий из встроенного документа SVG

Question

Ни один из вопросов, которые я просматривал, кажется, не помогает мне в этом.

Я встраиваю документ SVG таким образом:

<embed onload="fixup()" id="zgraphic" src="images/test.svg" width="500" type="image/svg+xml" />

И затем я пытаюсь найти элементыв SVG и добавьте к ним обработчики событий.Я уже узнал, что jQuery не будет работать, чтобы найти элементы SVG.У меня это в голове:

<script type="text/javascript">

 function blah(event) {
     alert("Got event: " + event)
 }

    var svg;
    var slot1;

function fixup() {
   svg = jQuery("#zgraphic")[0].getSVGDocument();
   slot1 = svg.getElementById("slot1");
   slot1.onclick = blah;
   alert("Set onclick for " + slot1);
  }
 </script>

Используя firebug, я вижу, что переменные svg и slot1 устанавливаются, и свойство onclick в slot1 также устанавливается.Но событие никогда не наступает.

Дополнительный вопрос: есть ли лучший способ получить корневой объект SVGDocument, чем то, как я это делаю?Я попал туда методом проб и ошибок, но мне это кажется шатким, и я не смог найти ничего подобного в Интернете.Было бы хорошо, если бы jQuery мог проникнуть в документ SVG, но я мог бы жить без него, если бы мне пришлось.

Answer 1

Создание функций в test.svg, которые вызывают правильный код в вашем файле с помощью функции fixup

Итак, в вашем файле test.svg у вас будет что-то вроде этого

function blah(e) {
e.stopPropagation();
window.parent.blah(e);

}

Answer 2

Я никогда не заставлял это работать, но я обнаружил, что то, что я хочу сделать, прекрасно работает в HTML 5 в браузерах, которые его поддерживают.Элемент svg интегрируется в DOM документа так же, как и все остальное, поэтому jQuery и getElementById работают так же, как и для других элементов.

Answer 3

Возможно, вы захотите взглянуть на gfx dojo: http://docs.dojocampus.org/dojox/gfx

Это API для доступа к векторным возможностям браузера.