[ Web 관련 ]/jQuery
체크박스 전체 체크
BIZLAB
2022. 5. 10. 12:54
https://devlink.tistory.com/865
#1 동의체크
<input type="checkbox" name="agree_all" id="agree_all" onfocus="sel_form_id(this.form);" title="전체동의"> 전체동의
<input type="checkbox" name="agree1" id="agree1" onfocus="sel_form_id(this.form);" title="개인정보 수집 및 이용에 대한 동의"> 개인정보 수집 및 이용에 대한 동의
<input type="checkbox" name="agree2" id="agree2" onfocus="sel_form_id(this.form);" title="마케팅 활용 동의"> 마케팅 활용 동의
<script>
//체크박스 전체 체크
$("#agree_all").click(function() {
if($("#agree_all").is(":checked")){
$("input[name=agree1]").prop("checked", true);
$("input[name=agree2]").prop("checked", true);
}else {
$("input[name=agree1]").prop("checked", false);
$("input[name=agree2]").prop("checked", false);
}
});
//체크박스 체크
$("input[name=agree1], input[name=agree2]").click(function() {
if($("#agree1").is(":checked") && $("#agree2").is(":checked")){
$("#agree_all").prop("checked", true);
}else{
$("#agree_all").prop("checked", false);
}
});
</script>
#2 일반 체크박스
$(document).ready(function() {
$("#cbx_chkAll").click(function() {
if($("#cbx_chkAll").is(":checked")) $("input[name=chk]").prop("checked", true);
else $("input[name=chk]").prop("checked", false);
});
$("input[name=chk]").click(function() {
var total = $("input[name=chk]").length;
var checked = $("input[name=chk]:checked").length;
if(total != checked) $("#cbx_chkAll").prop("checked", false);
else $("#cbx_chkAll").prop("checked", true);
});
});