반응형
확인란의 확인 된 변경 이벤트를 잡아라
<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/
내 경험상 이벤트의 currentTarget을 활용해야했습니다.
$("#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>
참고 URL : https://stackoverflow.com/questions/1455223/catch-checked-change-event-of-a-checkbox
반응형
'Programming' 카테고리의 다른 글
| 폴더의 모든 파일을 여는 방법은 무엇입니까? (0) | 2020.07.13 |
|---|---|
| A 태그에서 너비와 높이 설정 (0) | 2020.07.13 |
| Canvas에 그릴 텍스트 너비 측정 (Android) (0) | 2020.07.12 |
| 더 이상 사용되지 않는 코드를 Ruby에 표시하는 가장 좋은 방법은 무엇입니까? (0) | 2020.07.12 |
| iOS에서 Pan과 Swipe의 차이점은 무엇입니까? (0) | 2020.07.12 |