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().

El único modo de deshacer preventDefault() es recargar la página web.

O en su defecto hacerlo mediante jQuery.

Hablaremos de ello más adelante.

Ejemplo .preventDefault()

Veamos un ejemplo de uso:

código javascript preventDefault()

Entradas relacionadas:

Validación de formularios web: Como desactivar el envío con Javascript Veamos como podemos deshabitar el envío de un formulario web mediante javascript. Explico el método clásico y otra alternativa más limpia mediante preventDefault().
Eliminar eventos Javascript .removeEventListener() Ejemplos prácticos de como usar addEventListener() y removeEventListener() del tutorial gratuito de Javascript (y apuntes para mis alumnos)
Introducción a los eventos javascript 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()
Métodos imprescindibles para trabajar con fechas en Javascript Compendio de métodos para trabajar con fechas en Javascript. Comparto mi chuleta de métodos para obtener y crear nuevas fechas.
Introducción a las animaciones Javascript: setInterval() y setTimeout() Resumimos las funciones setInterval(), clearInterval y setTimeout(). Cuales son sus parámetros, que es una función anónima y como la llamamos.
Sustituir un nodo por otro en el DOM mediante Javascript 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.
Como eliminar nodos del DOM mediante Javascript Resumimos como eliminar nodos del DOM mediante javascript y siguiendo una estrategia sencilla mediante .removeChild()
Como añadir nuevos nodos al DOM usando Javascript En esta entrada vemos un tutorial paso a paso sobre como añadir nuevos nodos al DOM mediante Javacript con el ejemplo de un párrafo y el de una imagen.
Resumen de carácteres extraños en Javascript Muchos alumnos me habéis pedido esta entrada sobre los carácteres , . : ; [] {} () en Javascript. Y es que tenéis razón. Hay pocos recursos en internet que los aglutinen y nos expliquen dónde debemo...
La etiqueta noscript El desconocimiento hace que a menudo muchos usuarios decidan desactivar la opción de que nuestra navegador acepte y/o interprete este lenguaje de script. ¿Que podemos hacer para avisar a los usuarios ...
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