Saltar la navegación

Resolviendo el problema con stopPropagation()

Como pudimos ver en la anterior sección, a veces el event bubbling puede ocasionar problemas, pero existe una manera de prevenirlos. El objeto Event contiene un método llamado stopPropagation() que cuando es llamado dentro de un manejador de evento, evita que el evento burbujee hacia los elementos de más arriba.

Podemos solucionar nuestro problema actual al cambiar el código JavaScript por lo siguiente:

Todo lo que estamos haciendo aquí es llamar al método stopPropagation() en el objeto evento dentro del manejador del evento 'click' para el elemento <video>. Esto evitará que el evento burbujee hacia la caja de más arriba. Ahora intenta hacer clic en el botón y luego en el video:

Ver Resultado