2010-12-27 20 views
0

Keine der Fragen, die ich durchsucht habe, scheint mir dabei zu helfen.Ereignisse aus einem eingebetteten SVG-Dokument abrufen

Ich Einbetten eines SVG-Dokument so:

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

Und dann versuche ich, Elemente in der SVG zu suchen und hinzufügen, um sie Event-Handler. Ich habe bereits gelernt, dass jQuery nicht funktioniert, um SVG-Elemente zu finden. Ich habe dies in dem Kopf:

<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 kann ich sehen, dass die svg und slot1 Variablen gesetzt sind immer, und die OnClick Eigenschaft von slot1 ebenfalls gesetzt zu werden. Aber das Ereignis kommt nie.

Side Frage: Gibt es eine bessere Möglichkeit, das SVGDocument Root-Objekt als die Art, wie ich es tun? Ich bin durch Versuch und Irrtum dorthin gekommen, aber es sieht wackelig für mich aus und ich konnte nichts dergleichen im Internet finden. Es wäre schön, wenn jQuery in das SVG-Dokument greifen könnte, aber ich kann ohne es leben, wenn ich muss.

Antwort

0

Ich habe nie das funktioniert, aber ich habe entdeckt, was ich tun möchte funktioniert gut in HTML 5 auf Browsern, die es unterstützt. Ein Svg-Element wird in das Dokument-DOM integriert, genauso wie alles andere, also funktionieren jQuery und getElementById genauso wie für andere Elemente.

1

erstellen Funktionen in test.svg, die den richtigen Code in der Datei mit der fixup Funktion aufrufen

Also in Ihrem test.svg Datei, die Sie so etwas wie dieses

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

}

haben werden
Verwandte Themen