<body>
<input type="checkbox" id="mod_gb1" name="mod_gb" value="1" class="border-none" /> 이용 <br />
<input type="checkbox" id="mod_gb2" name="mod_gb" value="2" class="border-none" /> 변경 <br />
<input type="checkbox" id="mod_gb3" name="mod_gb" value="3" class="border-none" /> 해지
<input type="button" id="btn" />
</body>
1. 특정 체크박스 체크 확인
<script>
$('#mod_gb2').click(function() {
var ischecked = $('#mod_gb2').attr('checked');
if(ischecked){
alert("2번이 체크되었습니다.");
}else{
alert("2번이 체크되지 않았습니다.");
}
});
</script>
2. 체크 박스 전체
$('input[name=mod_gb]:checkbox').click(function() { // name이 mod_gb인 체크박스 그룹의 아무 박스를 선택하면
var gb1 = $('#mod_gb1').attr('checked');
var gb2 = $('#mod_gb2').attr('checked');
var gb3 = $('#mod_gb3').attr('checked');
if(gb3 && (gb1 || gb2)){
alert("ID 해지는 다른 항목과 중복 선택하실 수 없습니다.");
$('#mod_gb3').attr('checked', false);
}
});
3. 체크박스 선택 유무 확인
$('#btn').click(function(){
var cnt = $("input[name=mod_gb]:checkbox:checked").length;
if(cnt < 1){
alert('한 개 이상을 선택하셔야 합니다');
}else{
alert(cnt+'개가 선택되었습니다');
}
});
4. 체크박스 숫자 확인
$('#all').click(function() {
var checkboxCnt = $("input:checkbox").length; // 체크박스 전체 갯수
var checkYn = $('#all').attr('checked');
if(checkYn){
$('input:checkbox').attr('checked',true);
$('input:checkbox').attr('disabled',true);
$('#all').attr('disabled',false);
}else{
$('input:checkbox').attr('checked',false);
$('input:checkbox').attr('disabled',false);
}
});
var gb1 = $('#mod_gb1').attr('checked');
var gb2 = $('#mod_gb2').attr('checked');
var gb3 = $('#mod_gb3').attr('checked');
if(gb3 && (gb1 || gb2)){
alert("ID 해지는 다른 항목과 중복 선택하실 수 없습니다.");
$('#mod_gb3').attr('checked', false);
}
});
3. 체크박스 선택 유무 확인
$('#btn').click(function(){
var cnt = $("input[name=mod_gb]:checkbox:checked").length;
if(cnt < 1){
alert('한 개 이상을 선택하셔야 합니다');
}else{
alert(cnt+'개가 선택되었습니다');
}
});
4. 체크박스 숫자 확인
$('#all').click(function() {
var checkboxCnt = $("input:checkbox").length; // 체크박스 전체 갯수
var checkYn = $('#all').attr('checked');
if(checkYn){
$('input:checkbox').attr('checked',true);
$('input:checkbox').attr('disabled',true);
$('#all').attr('disabled',false);
}else{
$('input:checkbox').attr('checked',false);
$('input:checkbox').attr('disabled',false);
}
});
''.' Programs > jQuery' 카테고리의 다른 글
| jQuery의 정의 셀렉터를 사용한 radio 버튼 값 가져오기. (0) | 2012.10.22 |
|---|---|
| [jQuery Mobile] swipe ( flicking) 구현방법정리 (0) | 2012.09.27 |
| [jQuery] checkbox 전체선택 , 해제 (0) | 2012.04.25 |
| [jQuery] 제이쿼리 모음 20 (0) | 2012.03.21 |
| [jQuery] 자주 쓰이는 유용한 팁 (1) | 2012.03.16 |