web-dev-qa-db-fra.com

Empêcher la perte de mémoire lorsque vous cliquez dessus (sans désactiver ou en lecture seule)

J'utilise une case à cocher et je veux que les gens puissent le cocher/décocher. Cependant, quand ils décochent cela, j'utilise un popup modal jQueryUI pour confirmer qu'ils veulent vraiment le faire. Ainsi, ils peuvent cliquer OK ou Cancelet je veux que ma case à cocher ne soit décochée que s’ils cliquent OK.
C’est la raison pour laquelle j’aimerais saisir l’événement décoché pour éviter que la case à cocher ne soit décochée visuellement, et la décocher moi-même par programmation si l’utilisateur clique sur OK.

Comment pourrais-je faire ça?

PS: Je sais que je pourrais le vérifier à nouveau si l'utilisateur clique dessus. Cancel mais cela déclencherait l'événement check que je ne veux pas.

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

Quelque chose comme:

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

FIDDLE

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

preventDefault() désactive le comportement par défaut de votre input[type="checkbox"]

Et sur votre popup popup

$("#ok").on('click',function(){
    $("#yourCheckBoxId").attr("checked",true);
});
1
AdityaParab
   $("#checkboxID").click(function(e) { 
      var checkbox = $(this);
      if (checkbox.is(":checked")) {
       //check it 
      } else {
       // prevent from being unchecked
        this.checked=!this.checked;
      }
   });
0
Yaw shadi

Solution Pure CSS

Sélectionnez la case à cocher comme - 

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

Fonctionne plutôt bien et vous pouvez maintenant basculer votre case à cocher sur n'importe quel élément de votre choix. 

0
Pranjal jaju