复选框状态更改检测

Question

I have a scenario in which i am showing/Hiding a portion of the screen depending on whether the check box is checked or now.

So the catch here is that, Not only the user will be changing the state of the check box, but also programmatically.

So how do i detect this change and when ever the state of check box is changed , i want to section to be hidden or shown.

Presently i am doing like this...

    externalCheckBoxClicked : function (e){
        var $target = $(e.target),
          checked = $target.prop('checked');

        if(checked){
            $('#confirm-button').show();
        }else{
            $('#confirm-button').hide();
        }
    }

    setToPreviousSetValues : function(){
        if(this.requestData.isOverrideExternalParams === "1"){
            $('#ExternalParametersChkBox').prop('checked',true);
        }else {
            $('#ExternalParametersChkBox').prop('checked',false);
        }
    },

   events: {
       "change #ExternalParametersChkBox":"externalCheckBoxClicked",
    },

Any Clue why this is not working.

Answer 1

$('#yourID').change(function() {
  // your code
});

Answer 2

you can try this one:

$(".checkbox").change(function() {
    if(this.checked) {
        //Do stuff
    }
});

You can add .checkbox this place Something Class File Or Id file

Answer 3

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

$("#something").click( function(){
   if( $(this).is(':checked') ) alert("checked");
});

Doing this will not catch when the checkbox changes for other reasons than a click, like using the keyboard. To avoid this problem, listen to changeinstead of click.

Source: Catch checked change event of a checkbox

For programmatically changing: Why isn't my checkbox change event triggered?