JQuery CheckBox Checked State Changed Event

$postList = $('#post-list');
$postList.find('h1').on('click', onH1Clicked);
function onH1Clicked() {
  alert($(this).text());
}
// simulate added content
var title = 2;
function generateRandomArticle(title) {
  $postList.append('<article class="post"><h1>Title ' + title + '</h1></article>');
}
setTimeout(generateRandomArticle.bind(null, ++title), 1000);
setTimeout(generateRandomArticle.bind(null, ++title), 5000);
setTimeout(generateRandomArticle.bind(null, ++title), 10000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<section id="post-list" class="list post-list">
  <article class="post">
    <h1>Title 1</h1>
  </article>
  <article class="post">
    <h1>Title 2</h1>
  </article>
</section>

Antwoord 3, autoriteit 2%

Gewoon een andere oplossing

$('.checkbox_class').on('change', function(){ // on change of state
   if(this.checked) // if changed state is "CHECKED"
    {
        // do the magic here
    }
})

Antwoord 4

Als het je bedoeling is om een gebeurtenis alleen toe te voegen aan aangevinkte selectievakjes (zodat het zou worden geactiveerd als ze worden uitgeschakeld en later opnieuw worden aangevinkt), dan is dit wat je wilt.

$(function() {
    $("input[type='checkbox']:checked").change(function() {
    })
})

als het uw bedoeling is om een evenement toe te voegen aan alle selectievakjes (aangevinkt en niet aangevinkt)

$(function() {
    $("input[type='checkbox']").change(function() {
    })
})

als je wilt dat het alleen wordt geactiveerd wanneer ze worden aangevinkt (van niet aangevinkt), antwoord dan @James Allardice hierboven.

BTW input[type='checkbox']:checkedis CSS-kiezer.

Antwoord 5

$(document).ready(function () {
    $(document).on('change', 'input[Id="chkproperty"]', function (e) {
        alert($(this).val());
    });
});

Antwoord 6

Dit is de oplossing om te vinden is het selectievakje is gecontroleerd of niet.
Gebruik de functie #PROP () //

$("#c_checkbox").on('change', function () {
                    if ($(this).prop('checked')) {
                        // do stuff//
                    }
                });

Antwoord 7

is heel eenvoudig, dit is de manier waarop ik gebruik:

jQuery:

$(document).on('change', '[name="nameOfCheckboxes[]"]', function() {
    var checkbox = $(this), // Selected or current checkbox
        value = checkbox.val(); // Value of checkbox
    if (checkbox.is(':checked'))
    {
        console.log('checked');
    }else
    {
        console.log('not checked');
    }
});

Regards!

Antwoord 8

Actie op basis van een gebeurtenis (op klik-gebeurtenis).

$('#my_checkbox').on('click',function(){
   $('#my_div').hide();
   if(this.checked){
     $('#my_div').show();
   }
});

Zonder evenement actie ondernemen op basis van de huidige staat.

$('#my_div').hide();
if($('#my_checkbox').is(':checked')){
  $('#my_div').show();
}

Antwoord 9

Misschien is dit misschien een alternatief voor u.

<input name="chkproperty" onchange="($(this).prop('checked') ? $(this).val(true) : $(this).val(false))" type="checkbox" value="true" />`

Antwoord 10

Probeer deze jQuery-validatie

$(document).ready(function() {
  $('#myform').validate({ // initialize the plugin
    rules: {
      agree: {
        required: true
      }
    },
    submitHandler: function(form) {
      alert('valid form submitted');
      return false;
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.js"></script>
<form id="myform" action="" method="post">
  <div class="buttons">
    <div class="pull-right">
      <input type="checkbox" name="agree" /><br/>
      <label>I have read and agree to the <a href="https://stackexchange.com/legal/terms-of-service">Terms of services</a> </label>
    </div>
  </div>
  <button type="submit">Agree</button>
</form>

function msg(animal,is) {
  console.log(animal, is.checked);   // Do stuff
}

<input type="checkbox" oninput="msg('dog', this)" />Do you have a dog? <br>
<input type="checkbox" oninput="msg('frog',this)" />Do you have a frog?<br>
...

<script>
      $('#checkbox').on('click',function(){
          if(this.checked){
              $('#checkbox').hide();
           }else{
              $('#checkbox').show();
           }
      });
 </script>