Evitar que la casilla de verificación se desmarque al hacer clic (sin deshabilitar o de solo lectura)

Question

Estoy usando una casilla de verificación y quiero que la gente pueda marcarla o desmarcarla. Sin embargo, cuando lo desmarcan, estoy usando una ventana emergente modal jQueryUI para confirmar que realmente quieren hacer eso. Por lo tanto, pueden hacer clic en OK o Cancelar, y quiero que mi casilla de verificación esté desmarcada solo si hacen clic en OK.
Es por eso que me gustaría ver el evento desmarcar para evitar que la casilla de verificación se desmarque visualmente, y desmarcarlo yo mismo programáticamente si el usuario hace clic en OK.

¿Cómo podría hacer eso?

PD: Sé que podría volver a comprobar después si el usuario hace clic en Cancelar pero que pondrían en marcha el evento check, que no quiero.

Answer 1

$("#checkboxID").on("click", function (e) { 
    var checkbox = $(this); 
    if (checkbox.is(":checked")) { 
     // do the confirmation thing here 
     e.preventDefault(); 
     return false; 
    } 
}); 

Answer 2

$("#yourCheckBoxId").on('change',function(e){ 
    e.preventDefault(); 
    $("#yourPopDiv").popup(); 
}); 

preventDefault() desactivará el comportamiento por defecto de su input[type="checkbox"]

Y en su div emergente

$("#ok").on('click',function(){ 
    $("#yourCheckBoxId").attr("checked",true); 
}); 

Answer 3

Algo así como:

$("#test").on('change', function() { 
    this.checked=!this.checked?!confirm('Really uncheck this one ?'):true; 
}); 
​ 

FIDDLE

Answer 4

CSS puro Solución

Seleccione Casilla como -

input[type="checkbox"] { 
    pointer-events: none; 
} 

funciona bastante bien, y ahora se puede alternar su casilla de verificación en cualquier elemento de clic de su elección.