发表新帖
发表新帖

Catch checked change event of a checkbox

后端 未结
关注
9 1923
盖世英雄少女心
盖世英雄少女心 2020-12-12 17:09

How do I to catch check/uncheck event of with jQuery?

相关标签:
9条回答
  • 说谎
    2020-12-12 17:15 
    $(document).ready(function(){
    checkUncheckAll("#select_all","[name='check_boxes[]']");
});

var NUM_BOXES = 10;
// last checkbox the user clicked
var last = -1;
function check(event) {
  // in IE, the event object is a property of the window object
  // in Mozilla, event object is passed to event handlers as a parameter
  event = event || window.event;

  var num = parseInt(/box\[(\d+)\]/.exec(this.name)[1]);
  if (event.shiftKey && last != -1) {
    var di = num > last ? 1 : -1;
    for (var i = last; i != num; i += di)
      document.forms.boxes['box[' + i + ']'].checked = true;
  }
  last = num;
}
function init() {
  for (var i = 0; i < NUM_BOXES; i++)
    document.forms.boxes['box[' + i + ']'].onclick = check;
}

    HTML:

    <body onload="init()">
  <form name="boxes">
    <input name="box[0]" type="checkbox">
    <input name="box[1]" type="checkbox">
    <input name="box[2]" type="checkbox">
    <input name="box[3]" type="checkbox">
    <input name="box[4]" type="checkbox">
    <input name="box[5]" type="checkbox">
    <input name="box[6]" type="checkbox">
    <input name="box[7]" type="checkbox">
    <input name="box[8]" type="checkbox">
    <input name="box[9]" type="checkbox">
  </form>
</body>
    0 讨论(0)
  • 北海茫月
    2020-12-12 17:20 
    <input type="checkbox" id="something" />

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

    Edit: 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.

    For checking/unchecking programmatically, take a look at Why isn't my checkbox change event triggered?

    0 讨论(0)
  • 灰色年华
    2020-12-12 17:20

    Use below code snippet to achieve this.:

    $('#checkAll').click(function(){
  $("#checkboxes input").attr('checked','checked');
});

$('#UncheckAll').click(function(){
  $("#checkboxes input").attr('checked',false);
});

    Or you can do the same with single check box:

    $('#checkAll').click(function(e) {
  if($('#checkAll').attr('checked') == 'checked') {
    $("#checkboxes input").attr('checked','checked');
    $('#checkAll').val('off');
  } else {
    $("#checkboxes input").attr('checked', false);
    $('#checkAll').val('on'); 
  }
});

    For demo: http://jsfiddle.net/creativegala/hTtxe/

    0 讨论(0)
  • 长发绾君心
    2020-12-12 17:22

    In my experience, I've had to leverage the event's currentTarget:

    $("#dingus").click( function (event) {
   if ($(event.currentTarget).is(':checked')) {
     //checkbox is checked
   }
});
    0 讨论(0)
  • 梦如初夏
    2020-12-12 17:28

    For JQuery 1.7+ use:

    $('input[type=checkbox]').on('change', function() {
  ...
});
    0 讨论(0)
  • 盖世英雄少女心
    2020-12-12 17:31

    This code does what your need:

    <input type="checkbox" id="check" >check it</input>

$("#check").change( function(){
   if( $(this).is(':checked') ) {
        alert("checked");
    }else{
        alert("unchecked");
   }
});

    Also, you can check it on jsfiddle

    0 讨论(0)
 看不清?
提交回复
热议问题