javascript - Checkbox : 체크박스 체크여부 확인

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>check박스 체크 여부 확인하기</title>

  <script type="text/javascript">
    function CheckForm(Join){

        //체크박스 체크여부 확인 [하나]
        var chk1=document.frmJoin.U_checkAgreement1.checked;
        var chk2=document.frmJoin.U_checkAgreement2.checked;

        if(!chk1){
            alert('약관1에 동의해 주세요');
            return false;
        }
        if(!chk2) {
            alert('약관2에 동의해 주세요');
            return false;
        }

        //체크박스 체크여부 확인 [동일 이름을 가진 체크박스 여러개일 경우]
        var isSeasonChk = false;
        var arr_Season = document.getElementsByName("SEASON[]");
        for(var i=0;i<arr_Season.length;i++){
            if(arr_Season[i].checked == true) {
                isSeasonChk = true;
                break;
            }
        }

        if(!isSeasonChk){
            alert("계절의 종류를 한개 이상 선택해주세요.");
            return false;
        }

    }

</script>
</head>
<body>


<form name="frmJoin" action=""  onSubmit="return CheckForm(this)">
    <input type="checkbox" name="U_checkAgreement1" id="U_checkAgreement1" value="" /> 약관동의
    <input type="checkbox" name="U_checkAgreement2" id="U_checkAgreement2" value="" /> 약관동의

    <br/>
    <br/>
    <input type="checkbox" id="spring" name="SEASON[]" value="1" />봄
    <input type="checkbox" id="summer" name="SEASON[]" value="2" />여름
    <input type="checkbox" id="fall" name="SEASON[]" value="3" />가을
    <input type="checkbox" id="windter" name="SEASON[]" value="4" />겨울
    <br/>
    <br/>
    <input type="submit" value="전송">
</form>

</body>
</html>

jQuery로 변경

[코드]

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

        //체크박스 체크여부 확인 [동일 이름을 가진 체크박스 여러개일 경우]
        /*var isSeasonChk = false;
        var arr_Season = document.getElementsByName("SEASON[]");
        for(var i=0;i<arr_Season.length;i++){
            if(arr_Season[i].checked == true) {
                isSeasonChk = true;
                break;
            }
        }*/

        //jQuery로 변경
        var isSeasonChk = $("input:checkbox[name='SEASON[]']").is(":checked");

        if(!isSeasonChk){
            alert("계절의 종류를 한개 이상 선택해주세요.");
            return false;
        }

Atachment
첨부 '3'	2014-09-30_010517.png, 2014-09-30_010534.png, 2014-09-30_010549.png,

List of Articles
번호	제목	날짜	조회 수
167	엔터키 / enter key submit form	2018.09.28	1528
166	엔코딩/디코딩 함수	2016.09.21	6033
165	엑셀처럼 td 사이즈 조절하기	2019.01.16	3387
164	에러처리	2019.01.16	1066
163	양력-음력	2015.02.03	7661
162	시간 계산하기 (시/분/초/ 더하기, 빼기)	2021.08.20	1708
161	스타일로 제목 자르기	2016.09.12	5833
160	스마트에디터(SmartEditor)에서 textarea 유효성 체크하기	2018.07.04	3986
159	스마트 에디터 (네이버 에디터) 에디터 내에서 이미지 크기 줄이기.(리사이징)	2018.07.04	2715
158	셀렉트(select) change 이벤트 (split)	2016.12.23	6009
157	셀렉트(select) change href 이벤트	2016.12.23	5899
156	셀렉트(select) change Ajax 이벤트	2016.12.23	12577
155	선택된 데이터 부모창에 넘기기 (iframe ☞ 부모창)	2015.04.28	6614
154	선택된 select 의 option 값을 다른 select로 넘겨주기	2014.03.01	5668
153	선택(CheckBox) 된 Row 삭제 - 화면에서 추가된 Row	2015.04.28	13538
152	샘플) top left menu	2014.03.01	5513
151	새창을 띠워서 focus주기	2014.03.01	5715
150	새로고침(F5) 금지	2018.03.28	6001
149	비동기 작업의 원리 (JavaScript 엔진, Web API, Task Queue, Event Loop)	2023.01.20	138
148	브라우저별 이미지 크기 변경	2016.11.17	7928

167

엔터키 / enter key submit form

2018.09.28

1528

166

엔코딩/디코딩 함수

2016.09.21

6033