recargar - no funciona evento click jquery

Los eventos de clic de SVG no se activan/burbujean cuando se usa el elemento<use>

Question

Me encontré con un error interesante (?) Por el cual si incrusta el SVG usando <use> como parte de un enlace (un ícono por ejemplo) - el ícono mismo no registra un evento click en jQuery, pero hacer clic en el texto sí lo hace. Creo que esto se debe a que los eventos SVG no están burbujeando?

Si incrusta el SVG directamente, el enlace se activa independientemente de si hace clic en el texto o en el ícono.

Un caso de prueba simple que he creado se puede ver aquí: SVG <use> bug test case .

Answer 1

Tuve el mismo problema y utilicé display: block o display: inline-block en el enlace y funcionó.

Answer 2

Yo tuve el mismo problema. La solución que uso es simplemente poner un div transparente sobre el svg. Pero eso no es ideal, por supuesto.

Answer 3

Use pointer-events: none; en el svg. Funcionó para mí

El elemento nunca es el objetivo de los eventos del mouse; sin embargo, los eventos del mouse pueden apuntar a sus elementos descendientes si esos descendientes tienen eventos de puntero configurados en algún otro valor. En estas circunstancias, los eventos del mouse desencadenarán escuchas de eventos en este elemento padre según corresponda en su camino hacia / desde el descendiente durante las fases de captura / burbuja de eventos.

https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events