-
jquery checkbox 팁Programming/javascript 2013. 12. 1. 13:59
1.체크박스 체크여부 알아내기
<body>
<input type="checkbox" name="ckname" id="ckid" value="YES">
<br/>
<input type="button" name="btn" id="btn1" value="Click">
</body>
<script>
$(document).ready(function() {
$('#btn1').click(function() {
var flag = $('#ckid').attr('checked');
if(flag) {
alert('체크되었습니다.');
}else{
alert('체크가 안되어 있네요.');
}
});
});
</script>
2.여러개의 체크박스중 체크한 갯수 알아내기
<body>
<input type="checkbox" name="ckname" id="ckid1" value="1">
<br/>
<input type="checkbox" name="ckname" id="ckid2" value="2">
<br/>
<input type="checkbox" name="ckname" id="ckid3" value="3">
<br/>
<input type="button" name="btn" id="btn2" value="Click">
</body>
<script>
$(document).ready(function() {
$('#btn2').click(function() {
var cnt = $('input[name=ckname]:checkbox:checked').length;
alert(cnt + '개 체크되었습니다.');
});
});
</script>
3.여러개의 체크박스중 체크된 체크박스 정보 가져오기
<body>
<input type="checkbox" name="ckname1" id="ckid1" value="1">1번
<br/>
<input type="checkbox" name="ckname1" id="ckid2" value="2">2번
<br/>
<input type="checkbox" name="ckname1" id="ckid3" value="3">3번
<br/>
<input type="button" name="btn" id="btn3" value="Click">
</body>
<script>
$(document).ready(function() {
$('#btn3').click(function() {
$('input[name=ckname1]:checkbox').each(function(index){
var flag = $(this).attr('checked');
if(flag) {
alert($(this).val() + '번 체크박스가 체크되었습니다.');
}
});
});
});
</script>
'Programming > javascript' 카테고리의 다른 글
jQuery 에서 json 데이타를 읽어오는 방법 (1) 2013.12.11 jquery select box 팁 (0) 2013.12.01 자바스크립트 객체를 생성하는 5가지 방법 (0) 2013.08.13 자바스크립트 함수 (0) 2013.07.29 자바스크립트 제어문 (0) 2013.07.24