Ändern Sie das Kontrollkästchen jQuery und klicken Sie auf Ereignis

$(document).ready(function() {
  //set initial state.
  $('#textbox1').val($(this).is(':checked'));

  $('#checkbox1').change(function() {
    $('#textbox1').val($(this).is(':checked'));
  });

  $('#checkbox1').click(function() {
    if (!$(this).is(':checked')) {
      return confirm("Are you sure?");
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" id="checkbox1"/><br />
<input type="text" id="textbox1"/>

Hier wird .change()der Textfeldwert mit dem Kontrollkästchenstatus aktualisiert. Ich .click()bestätige die Aktion beim Deaktivieren. Wenn der Benutzer Abbrechen wählt, wird das Häkchen wiederhergestellt, aber .change()vor der Bestätigung ausgelöst .

Dadurch bleiben die Dinge in einem inkonsistenten Zustand und das Textfeld sagt false, wenn das Kontrollkästchen aktiviert ist.

Wie kann ich mit der Stornierung umgehen und den Textfeldwert mit dem Prüfstatus in Einklang bringen?

Getestet in JSFiddle und macht das, wonach Sie fragen. Dieser Ansatz hat den zusätzlichen Vorteil, dass er ausgelöst wird, wenn auf ein mit einem Kontrollkästchen verknüpftes Etikett geklickt wird.

Aktualisierte Antwort:

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val(this.checked);

    $('#checkbox1').change(function() {
        if(this.checked) {
            var returnVal = confirm("Are you sure?");
            $(this).prop("checked", returnVal);
        }
        $('#textbox1').val(this.checked);        
    });
});

Ursprüngliche Antwort:

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val($(this).is(':checked'));

    $('#checkbox1').change(function() {
        if($(this).is(":checked")) {
            var returnVal = confirm("Are you sure?");
            $(this).attr("checked", returnVal);
        }
        $('#textbox1').val($(this).is(':checked'));        
    });
});

Demo

Verwenden mousedown

$('#checkbox1').mousedown(function() {
    if (!$(this).is(':checked')) {
        this.checked = confirm("Are you sure?");
        $(this).trigger("change");
    }
});

Die meisten Antworten werden es (vermutlich) nicht fangen, wenn Sie es verwenden <label for="cbId">cb name</label>. Das heißt, wenn Sie auf das Etikett klicken, wird das Kontrollkästchen aktiviert, anstatt direkt auf das Kontrollkästchen zu klicken. (Nicht genau die Frage, aber verschiedene Suchergebnisse kommen hierher)

<div id="OuterDivOrBody">
    <input type="checkbox" id="checkbox1" />
    <label for="checkbox1">Checkbox label</label>
    <br />
    <br />
    The confirm result:
    <input type="text" id="textbox1" />
</div>

In welchem ​​Fall könnten Sie verwenden:

Earlier versions of jQuery:

$('#OuterDivOrBody').delegate('#checkbox1', 'change', function () {
    // From the other examples
    if (!this.checked) {
        var sure = confirm("Are you sure?");
        this.checked = !sure;
        $('#textbox1').val(sure.toString());
    }
});

JSFiddle-Beispiel mit jQuery 1.6.4

jQuery 1.7+

$('#checkbox1').on('change', function() { 
    // From the other examples
    if (!this.checked) {
        var sure = confirm("Are you sure?");
        this.checked = !sure;
        $('#textbox1').val(sure.toString());
    }
});

JSFiddle-Beispiel mit der neuesten jQuery 2.x.

• Jsfiddle-Beispiele und HTML mit dem anklickbaren Kontrollkästchen hinzugefügt

Nun ... nur um Kopfschmerzen zu vermeiden (es ist nach Mitternacht hier), könnte ich mir Folgendes einfallen lassen:

$('#checkbox1').click(function() {
  if (!$(this).is(':checked')) {
    var ans = confirm("Are you sure?");
     $('#textbox1').val(ans);
  }
});

Ich hoffe es hilft

Für mich funktioniert das super:

$('#checkboxID').click(function () {
    if ($(this).attr('checked')) {
        alert('is checked');
    } else {
        alert('is not checked');
    }
})

Hier sind Sie ja

Html

<input id="ProductId_a183060c-1030-4037-ae57-0015be92da0e" type="checkbox" value="true">

JavaScript

<script>
    $(document).ready(function () {

      $('input[id^="ProductId_"]').click(function () {

        if ($(this).prop('checked')) {
           // do what you need here     
           alert("Checked");
        }
        else {
           // do what you need here         
           alert("Unchecked");
        }
      });

  });
</script>

Entfernen Sie das Änderungsereignis und ändern Sie stattdessen den Wert des Textfelds im Klickereignis. Anstatt das Ergebnis der Bestätigung zurückzugeben, fangen Sie es in einer Variable ab. Wenn es wahr ist, ändern Sie den Wert. Dann geben Sie die var zurück.

Das Problem besteht darin, auf das Kontrollkästchen zu klicken und in derselben Ereignisschleife nach dem Wert zu suchen.

Versuche dies:

$('#checkbox1').click(function() {
    var self = this;
    setTimeout(function() {

        if (!self.checked) {
            var ans = confirm("Are you sure?");
            self.checked = ans;
            $('#textbox1').val(ans.toString());
        }
    }, 0);
});

Demo: http://jsfiddle.net/mrchief/JsUWv/6/

Wenn Sie die iCheck-Abfrage verwenden, verwenden Sie den folgenden Code

 $("#CheckBoxId").on('ifChanged', function () {
                alert($(this).val());
            });

Versuche dies

$('#checkbox1').click(function() {
        if (!this.checked) {
            var sure = confirm("Are you sure?");
            this.checked = sure;
            $('#textbox1').val(sure.toString());
        }
    });

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val($(this).is(':checked'));

    $('#checkbox1').change(function() {
        $('#textbox1').val($(this).is(':checked'));
    });

    $('#checkbox1').click(function() {
        if (!$(this).is(':checked')) {
            if(!confirm("Are you sure?"))
            {
                $("#checkbox1").prop("checked", true);
                $('#textbox1').val($(this).is(':checked'));
            }
        }
    });
});

// this works on all browsers.

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val($(this).is(':checked'));

    $('#checkbox1').change(function(e) {
        this.checked =  $(this).is(":checked") && !!confirm("Are you sure?");
        $('#textbox1').val(this.checked);
        return true;
    });
});

$('#checkbox1').click(function() {
    if($(this).is(":checked")) {
        var returnVal = confirm("Are you sure?");
        $(this).attr("checked", returnVal);
    }
    $('#textbox1').val($(this).is(':checked')); 
});


<div id="check">
    <input type="checkbox" id="checkbox1" />
    <input type="text" id="textbox1" />
</div>

Späte Antwort, aber Sie können auch verwenden on("change")

$('#check').on('change', function() {
     var checked = this.checked
    $('span').html(checked.toString())
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" id="check" > <span>Check me!</span>

Verwenden Sie einfach das Klickereignis. Meine Kontrollkästchen-ID lautet CheckAll

     $('#CheckAll').click(function () {

        if ($('#CheckAll').is(':checked') == true) {

             alert(";)");
      }
    }

Funkwert nach Namen abrufen

 $('input').on('className', function(event){
        console.log($(this).attr('name'));
        if($(this).attr('name') == "worker")
            {
                resetAll();                 
            }
    });

Ich bin mir nicht sicher, warum jeder das so kompliziert macht. Das ist alles was ich getan habe.

if(!$(this).is(":checked")){ console.log("on"); }

 $("#person_IsCurrentAddressSame").change(function ()
    {
        debugger
        if ($("#person_IsCurrentAddressSame").checked) {
            debugger

        }
        else {

        }

    })