확인란의 확인 된 변경 이벤트를 잡습니다

StackOverflow https://stackoverflow.com/questions/1455223

  •  12-09-2019
  •  | 
  •  

문제

수표/선택 취소 이벤트를 잡으려면 어떻게해야합니까? <input type="checkbox" /> jQuery와 함께?

도움이 되었습니까?

해결책 

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

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

편집 : 키보드 사용과 같은 클릭 이외의 다른 이유로 확인란이 변경 될 때이 작업을 수행하지 않습니다. 이 문제를 피하려면 들어보십시오 change대신에 click.

프로그래밍 방식으로 확인/검사 해제하려면 내 확인란 변경 이벤트가 트리거되지 않는 이유는 무엇입니까?

다른 팁

입력 확인란에 첨부 된 경우 클릭이 레이블에 영향을 미칩니다.

.change () 함수를 사용하는 것이 낫다고 생각합니다.

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

$("#something").change( function(){
  alert("state changed");
});

사용 : 확인 확인란의 상태를 결정하기위한 선택기 :

$('input[type=checkbox]').click(function() {
    if($(this).is(':checked')) {
        ...
    } else {
        ...
    }
});

jQuery 1.7+ 사용 :

$('input[type=checkbox]').on('change', function() {
  ...
});

아래 코드 스 니펫을 사용하여이를 달성하십시오. :

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

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

또는 단일 확인란으로 동일한 작업을 수행 할 수 있습니다.

$('#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'); 
  }
});

데모 용 : http://jsfiddle.net/creativegala/httxe/

내 경험상, 나는 이벤트의 현재 타격을 활용해야했다.

$("#dingus").click( function (event) {
   if ($(event.currentTarget).is(':checked')) {
     //checkbox is checked
   }
});

MSIE와 가장 잘 호환되는 클릭 이벤트를 사용하십시오

$(document).ready(function() {
    $("input[type=checkbox]").click(function() {
        alert("state changed");
    });
});

이 코드는 당신에게 필요한 것을 수행합니다.

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

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

또한 확인할 수 있습니다 jsfiddle

$(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>
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top