메뉴 건너뛰기

프로그램언어

Home 프로그램언어 JAVA javascript
✔ 뷰어로 보기
2015.06.19 12:48

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

조쉬
조회 수 19010 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

가 크게 작게 위로 아래로 댓글로 가기 인쇄 첨부
?

단축키

Prev이전 문서

Next다음 문서

가 크게 작게 위로 아래로 댓글로 가기 인쇄 첨부
<!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;
        }

 

 

 


Facebook Twitter Google Pinterest
위로 아래로 댓글로 가기 인쇄 첨부
에디터 선택하기
?
List of Articles
번호 제목 날짜 조회 수
147 접근성 윈도우 팝업 띄우기 2016.12.22 7114
146 javascript 화면 캡쳐 2016.11.17 9820
145 input type file multiple list (파일 업로드 리스트 확인) file 2016.11.17 12432
144 JavaScript 에서 JSON 생성 2016.11.17 10323
143 브라우저별 이미지 크기 변경 file 2016.11.17 7928
142 간단한 동적 SELECT 박스 구현하기 2016.10.06 12367
141 엔코딩/디코딩 함수 2016.09.21 6001
140 쿠키(Cookie)에 값 저장하기 2016.09.21 6952
139 현재시간 기준 날짜 계산 2016.09.21 6103
138 함수의 arguments 를 이름(key)으로 접근하기 2016.09.21 5976
137 arguments object 2016.09.21 5652
136 연관배열 사용하기 2016.09.21 7134
135 javascript 에서 제공하는 3가지 종류의 팝업박스 2016.09.21 5657
134 onkeypress 키보드 이벤트 처리하는 법 – text, textarea 2016.09.21 7001
133 스타일로 제목 자르기 2016.09.12 5833
132 구구단 반복문,조건문 변경해서 만들기 2016.09.11 6091
131 jquery 기본 엘리먼트 속성제어방법 2016.09.11 5518
130 input radio 체크유무 검사 2016.09.11 5562
129 htaccess 자동으로 만들어주는 사이트 2016.09.11 5423
128 부드럽게 페이지 이동하기 2016.09.11 6003
쓰기
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 13 Next
/ 13

하단 정보를 입력할 수 있습니다

© 2016 JOSHI. All Rights Reserved
© k2s0o1d4e0s2i1g5n. All Rights Reserved