javascript - validaciones - validar campos vacios js

¿Es este un malentendido central del evento clic predeterminado en las entradas de casilla de verificación, o código defectuoso?

Question

Al vincular a un evento de clic para una entrada de casilla de verificación, la casilla ya está activada cuando se ejecuta mi controlador de eventos y, lo que es más extraño, la palanca se invierte después de que se ejecute mi controlador de eventos si especifico event.preventDefault ();

<input id="foo" type="checkbox"/>

function clicked(evt) {
   alert(document.getElementById(''foo'').checked);
   evt.preventDefault();
}

document.getElementById(''foo'').addEventListener(''click'',clicked);

[probado en Chrome y Firefox]

JSFiddle para ese código

La alerta responderá "verdadero" (o el estado opuesto a la casilla de verificación previa). Después de descartar la alerta, la casilla de verificación se alterna.

Entonces, supongo que las preguntas son,

¿Cuál es el evento predeterminado real que se previene? ¿Me equivoco al asumir que mi controlador de eventos debería estar ejecutándose antes de que se cambie el estado? ¿Hay alguna manera de interceptar legítimamente un clic de casilla de verificación?

¿Y por qué en el mundo está el preventDefault que causa el cambio de la casilla de verificación?

Answer 1

El evento predeterminado real que se previene es el evento click . El malentendido probablemente ocurre porque estás pensando en el evento como disparar después de que el clic real haya sido procesado por completo (es decir, la casilla de verificación haya sido cambiada) mientras que en realidad el modelo de evento estipula que el manejador se dispara mientras se procesa el evento.

Si ayuda, otro modelo que he encontrado útil para explicar cómo funciona todo es el modelo de transacción de la base de datos: piense en su controlador de eventos como invocado como parte de una transacción, dentro de la cual la casilla de verificación ya se ha alternado.

• Si lee el estado de la casilla de verificación, la encontrará desactivada (la "escritura" se envió a la base de datos).
• Sin embargo, aún puede optar por deshacer la transacción (en cuyo caso la escritura se deshace y la casilla de verificación vuelve a su valor original).