En el siguiente ejemplo, cuando hace clic en la etiqueta, la entrada cambia de estado.
document.querySelector("label").addEventListener("click", function() {
console.log("clicked label");
});
label {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
<input type="checkbox" id="1">
<label for="1">Label</label>
En Chrome, cuando mueve el cursor entre los eventos mousedown
y mouseup
, la entrada aún se activa, mientras que en Firefox la casilla de verificación no cambia de estado.
¿Hay alguna manera de arreglar esto? (sin usar oyentes de eventos de JavaScript)
Versión de Firefox: 69.0.3 (64-bit)
Conjunto completo de acciones cuando se usa Chrome.
- Presione el botón sobre la etiqueta
- Mueva el cursor (incluso fuera de la etiqueta) mientras mantiene presionado el botón
- Regrese el cursor a la etiqueta
- Suelta el botón
1px
interrumpirá la interacción.