Siéntete en la libertad de compartir nuestra página y códigos en tus redes, ayúdanos a hacer crecer esta comunidad.
Solución:
Usar event.currentTarget que es siempre el objeto que escucha el evento; event.target es el objetivo real que recibió el evento, que no es lo que desea en este caso, ya que podría ser el icono.
Con event.currentTarget si el usuario hace clic en el icono, el evento se propagará al objeto de escucha, que es el botón en su caso. Si el usuario hace clic en el botón, seguirá funcionando porque, de nuevo, el detector de objetos es su botón.
Es causado por la propagación de eventos. Haces clic en el icono, que está dentro del botón, por lo que click El evento se propaga a través del DOM desde el icono, hasta el botón, hasta el documento. Esto da como resultado su click el código del controlador de eventos se está ejecutando.
Si el problema es que solo desea la referencia al botón cada vez que se ejecuta ese código, pero aún desea que se active cuando haga clic en el icono en lugar del texto, solo necesita usar this en vez de event.target:
var $btn = $(this);
...
jQuery se asegurará de que this siempre se refiere al botón, incluso si el event.target elemento es un elemento dentro de él.
Solución CSS simple:
button > *
pointer-events: none;
Agradecemos que desees añadir valor a nuestra información participando con tu veteranía en las críticas.