Skip to content

Instantly share code, notes, and snippets.

@DanielRamosAcosta

DanielRamosAcosta/stop-propagation-prevent-default.html

Created August 31, 2018 10:06
Show Gist options
  • Save DanielRamosAcosta/7805f960b4b183b76827e3b0d8f0515f to your computer and use it in GitHub Desktop.
Save DanielRamosAcosta/7805f960b4b183b76827e3b0d8f0515f to your computer and use it in GitHub Desktop.
Download ZIP
Raw
stop-propagation-prevent-default.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<form action="/register" method="post">
<input type="text" name="name" id="name" placeholder="Nombre">
<input type="text" name="password" id="password" placeholder="Nombre">
<input type="submit" value="Registrarme" id="submit-register">
</form>
<div id="contenedor" style="padding: 50px; background-color: red">
<div>
<button id="boton-contenedor">Boton Contendor</button>
</div>
</div>
<script>
const submit = document.getElementById('submit-register')
submit.addEventListener('click', event => {
event.preventDefault()
console.log("Holaaa")
})
</script>
<script>
const contenedor = document.getElementById('contenedor')
const boton = document.getElementById('boton-contenedor')
contenedor.addEventListener('click', event => {
console.log("Has hecho click en el contenedor")
})
boton.addEventListener('click', event => {
event.stopPropagation()
console.log("Has hecho click en el boton")
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment