event.preventDefault

Resumen

Cancela el evento si este es cancelable, sin detener el resto del funcionamiento del evento, es decir, puede ser llamado de nuevo.

Sintaxis

event.preventDefault()

Ejemplo

Cambiar el estado de una caja de selecci贸n es la funci贸n por defecto de la acci贸n de hacer clic sobre la caja. Este ejemplo ilustra como hacer que esto no ocurra:

<html>
<head>
<title>ejemplo de preventDefault</title>

<script type="text/javascript">

function stopDefAction(evt) {
  evt.preventDefault();
}
</script>
</head>

<body>

<p>Por favor, haz clic sobre la caja de selecci贸n.</p>

<form>
<input type="checkbox" onclick="stopDefAction(event);"/>
<label for="checkbox">Selecci贸n</label>
</form>

</body>
</html>

Puedes ver preventDefault en acci贸n aqu铆.

El siguiente ejemplo demuestra c贸mo puede evitarse que un texto invalido entre en un campo de formulario mediante preventDefault().

<html>
<head>
<title>preventDefault example</title>

<script type="text/javascript">

function checkName(evt) {
var charCode = evt.charCode;

  if (charCode != 0) {
    if (charCode < 97 || charCode > 122) {
      evt.preventDefault();
      alert("Por favor usa s贸lo letras min煤sculas." + "\n"
            + "charCode: " + charCode + "\n"
      );
    }
  }
}

</script>
</head>

<body>

<p>Por favor entra tu nombre en letras min煤sculas solamente.</p>
<form>
<input type="text" onkeypress="checkName(event);"/>
</form>

</body>
</html>

Notas

Llamar a preventDefault en cualquier momento durante la ejecuci贸n, cancela el evento, lo que significa que cualquier acci贸n por defecto que deba producirse como resultado de este evento, no ocurrir谩.

Puedes usar event.cancelable para comprobar si el evento es cancelable o no. Llamar a preventDefault para un evento no cancelable, no tiene ning煤n efecto.

preventDefault no detiene las siguientes llamadas al evento producidas en el DOM. En su lugar deber铆a usarse event.stopPropagation para ese prop贸sito.

Especificaci贸n

DOM Level 2 Events: preventDefault