2010-07-01 11 views
6

Estoy tratando de agregar un controlador onClick a un objeto incrustado. El controlador necesita ejecutar una función que se encuentra en un archivo externo .js que está vinculado al archivo html actual a través del <script src="....Cómo agregar JavaScript on¿Haga clic en el controlador en un objeto html incrustado?

¿Es necesario hacer referencia a la función de forma diferente debido a que se encuentra en otro lugar?

Este es el código en su estado actual (que no funciona, sino que también no produce ningún error):

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

¿No puedes simplemente llamar al script dentro de svg onclick del contenedor principal? – mplungjan

+0

posible duplicado de [Cómo hacer una puede hacer clic objeto de imagen SVG con onclick, evitando posicionamiento absoluto] (http://stackoverflow.com/questions/2296097/making-an-svg-image-object-clickable-with-onclick-avoiding-absolute -posicionamiento) – jtbandes

Respuesta

8

deberá implementar onclick dentro el SVG y vincularlo a la externa Función de JavaScript usando javascript dentro de la svg. Consulte la wiki de SVG para ver ejemplos.

Actualización: Al parecer, el wiki de SVG no es más. No es de extrañar que las mejores referencias que ahora puedo encontrar (rápidamente) estén en StackOverflow.

This answer describes how to implement onclick inside the svg.

+0

Gracias. He colocado el onclick dentro de la forma svg en sí, sin embargo, ahora no puede encontrar la función que está buscando. ¿Presumiblemente porque está en un archivo .js externo? –

+0

¿Cómo llamas a la función externa desde tu SVG? ¿Lo ha prefijado con 'top' o' parent'? –

+0

Acabo de agregar onclick = "buttonEvent()" (después de probar con una alerta, que funcionó). ¿Qué debo prefijar y dónde? –

1

Utilice cualquiera de los enlaces de javascript (Mario Menger ya lo ha respondido).

Si no puede o no utilizar la unión, puede utilizar lo xil3 respondió con una modificación:

Usar una etiqueta de ancla vacío <a href="javascript:someFunc()"></a> como el clic del consumidor. Establezca su índice Z y su posición/tamaño para que se ubique sobre el objeto svg (para compatibilidad entre navegadores).

0

Onclick todos deben estar en minúsculas.

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

No creo que eso funcione. – wkm

Cuestiones relacionadas