Eliminar el comportamiento por defecto de un elemento html

Eliminar el comportamiento por defecto de un elemento html

Print Friendly, PDF & Email
Eliminar el comportamiento por defecto de un elemento html
Valora esta entrada
En ocasiones es difícil entender Javascript.

El tema que se toca hoy es una de estas ocasiones.

Concretamente como podemos hacer para eliminar el comportamiento por defecto de un elemento html.

Para ello vamos a usar el método .preventDefault()

Obtener el evento

Para eliminar el comportamiento por defecto de un elemento html usaremos el método .preventDefault()

Sin embargo antes es necesario saber (y creer, porqué la primera vez sorprende mucho) que Javascript genera un objeto salido de la nada que en todo momento almacena el evento que se ha ejecutado en un preciso instante.

Para explorer dicho objeto vendría a ser algo así como

evento = window.event;

Para cualquier navegador que no sea Explorer entonces necesitamos una función del tipo

function capturarEvento(event){

evento = event;

}

Quien mejor lo explica es LibrosWeb.es Recomiendo darle un vistazo al enlace anterior.

Desactivar el evento con .preventDefault()

Si hemos entendido (o nos creemos) como capturar el evento, entonces únicamente es necesario utilizar preventDefault()

Sería algo así como

nodo.addEventLister(“click”, function(e){

var evento = window.event || e;

evento.preventDefault();

});

Llegados a este punto es importante matizar que no conozco marcha atrás mediante Javascript para desactivar preventDefault().

En su lugar podemos asignar preventDefault() a una función llamada por algún tipo de evento y eliminar la función ligada al evento mediante removeEventListener().

Escrito es lioso pero podéis ver un ejemplo del código en este ejercicio.

Ejemplo .preventDefault()

Veamos un ejemplo de uso:

código javascript preventDefault()

Entradas relacionadas:

Ejercicio – Generación de una fecha personalizada mediante javascript
- 136
Ejercicio javascript dónde se trabaja con fechas y los métodos para fechas con el objetivo de crear fechas con formato personalizado.
Ejercicio – Programación de una ventana infinita cansina en JS
- 159
Ejercicio que pregunta iterativamente el color del caballo blanco de santiago hasta que se resuelve. Incluye solución.
Ejercicio – Corregir errores de sintaxis en funciones
- 163
Ejercicio javascript dónde se repasa la sintaxi de funciones. Corrige los errores.
Ejercicio – Corrige los errores (concepto acoplamiento javascript)
- 191
Ejercicio javascript en el que se repasa el concepto de acoplamiento y se piden corregir algunos errores típicos.
Ejercicio – Cálculo del perímetro de un rectángulo mediante funciones
- 178
Ejercicio en el que se práctica de modo fácil la lógica de programación mediante el uso de funciones declaradas en JS.
Sustituir un nodo por otro en el DOM mediante Javascript
- 288
Para poder sustituir un nodo por otro en el DOM previamente necesitas saber como: Identificar nodos del DOM. Crear nuevos nodos. Si tienes claros estos conceptos sigue leyendo el ejemplo práctico.
Ejercicio – corrección de errores en javascript. Variables y strings.
- 155
En este ejercicio practicamos la diferencia entre usar un string y una variable. También otras normas básicas de sintaxis de javascript.
Ejercicio JS – Salva pantallas primitivo con javascript
- 104
Ejercicio de salvapantallas primitivo creado con javascript básico y sin usar la etiqueta canvas. Incluye solución.
Instrucciones básicas para familiarizarse con javascript
- 605
El javascript es un lenguaje que se olvida a una velocidad de vértigo si no se practica. Es importante tener unos buenos apuntes 😉 Hoy presento instrucciones básicas que sirven para empezar con scrip...
Introducción a los eventos javascript
- 381
Repasamos las distintas formas que existen de asociar eventos javascript a etiquetas html. Ya sea por acoplamiento directo o como evento semántico. Comparamos también con addEventListener()
Francesc Ricart
hola@francescricart.com

Soy un ingeniero industrial a quién le apasiona aprender y enseñar. En el mundo del marketing online he encontrado una de mis pasiones. Ejerzo como docente ocupacional y privado para empresas. Y también hago consultoría web para PIMES, autónomos y otros emprendedores como yo. Ayudo a las empresas en cualquier temática relacionada con su presencia digital y herramientas web. Aunque mi especialidad es el posicionamiento en buscadores (SEO). A nivel de formación lo que más feliz me hace es que un alumno haga de mi pasión una forma de vida y le ayude a encontrar trabajo. A nivel de negocios ayudo a empresarios a desenvolverse con soltura en el mundo digital y les animo a hacer cada vez más cosas que nunca hubieran imaginado que ellos también podían hacer. En este camino les ayudo haciendo todo aquello dónde ellos no llegan y crecemos juntos. Encontraréis más acerca de mi en la página sobre mi

No hay comentarios

Escribir un comentario

  Acepto la política de privacidad

Responsable: FRANCESC RICART MUÑOZ.

Finalidad: Gestionar los comentarios que realizas en este blog.

Destinatarios: No se cederán datos a terceros, salvo obligación legal.

Derechos: Tienes derecho a acceder, rectificar y suprimir los datos, así como otros derechos, como se explica en la política de privacidad.