> ¿Cuál es la diferencia entre usar `preventDefault()` y `return false;`? Algunas diferencias: - **Funcionalidad**: `preventDefault`, como su nombre indica, previene la acción por defecto asociada a ese evento; mientras que `return false` devuelve el valor falso (algo que en algunas ocasiones podría prevenir la acción por defecto, pero que no es su objetivo principal). - **Ámbito**: `preventDefault` es un método de evento, es decir es una función dentro de un objeto y no funciona sin su evento (no puedes hacer `preventDefault()` sin más, tiene que ser `evento.preventDefault()`); Mientras que `return` es una sentencia que devuelve un valor y que puede ser llamada en cualquier momento. - **Posicionamiento**: dentro de un controlador de evento `preventDefault` se puede llamar a `preventDefault` en cualquier momento, mientras que `return false` sólo se puede hacer al final. Esto puede parecer trivial, pero puede tener diferentes resultados si hay algún error en JS en mitad del controlador de evento. **Aunque pueden funcionar de manera _similar_ en algunos casos, no siempre es así**. Por ejemplo: en JavaScript puro, si tienes un enlace con `a` y haces `preventDefault()`, la página no se redireccionará porque se evita la acción por defecto. Mientras que si haces `return false` sí que se realiza la redirección. <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-js --> document.querySelector("#enlace1").addEventListener("click", function(e) { e.preventDefault(); }); document.querySelector("#enlace2").addEventListener("click", function(e) { return false; }); <!-- language: lang-html --> <a href="http://es.stackoverflow.com" id="enlace1">Yo no redirecciono</a>... <a href="http://es.stackoverflow.com" id="enlace2">pero yo sí</a> <!-- end snippet --> Pero no siempre es así: si usas `return false` en el `onclick` en línea (_inline_) en lugar de usando `addEventListener`, entonces sí se evitará el evento por defecto (por ejemplo con formularios o enlaces). Eso es con JavaScript puro, dentro de jQuery curiosamente funcionan de manera un poco diferente. **En jQuery, `return false` es equivalente a hacer `preventDefault` y `stopPropagation`**. Es decir, no sólo se estaría evitando la acción por defecto sino que también se evitaría la propagación del evento a los ancestros del elemento. Un ejemplo de esto: <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-js --> $("div").on("click", function() { console.log("Evento click del div"); }); $("#enlace1").on("click", function(e) { e.preventDefault(); console.log("Evento click del enlace"); }); $("#enlace2").on("click", function(e) { console.log("Evento click del enlace"); return false; }); <!-- language: lang-html --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> <div> <a href="http://www.google.com" id="enlace1">Pulsándome a mí, también se ejecutará la acción del div padre</a> <br/> <a href="http://www.google.com" id="enlace2">...pero conmigo no</a> </div> <!-- end snippet --> En StackOverflow en Inglés, hay [una pregunta que trata este tema con jQuery][1] más en profundidad. > ¿En qué momento utilizar uno o el otro? Como todo: va a depender del contexto y de lo que quieras hacer. Especialmente si estás trabajando con jQuery, donde `return false` hace bastante más que simplemente evitar la acción por defecto. > ¿Es preferible inclinarse por alguno de los dos mencionados? Como pongo arriba, va a depender del contexto y de si estás usando JavaScript puro o alguna biblioteca como jQuery. Personalmente me gusta más usar `preventDefault`, pero es una elección propia. También deberías pensar en otros factores como lo que pongo en la diferencia en el posicionamiento: si ocurre un error en el controlador del evento, `return false` nunca se ejecutará. Sé que realmente no es algo tan grave (tienes un error, eso es más grave que no llegar al `return`), pero un detalle a tener en cuenta. [1]: http://stackoverflow.com/questions/1357118/event-preventdefault-vs-return-false