메뉴 건너뛰기

조회 수 7071 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

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

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
  1. <html>
  2.  <head>
  3.   <title> New Document </title>
  4.   <meta name="Generator" content="EditPlus">
  5.   <meta name="Author" content="">
  6.   <meta name="Keywords" content="">
  7.   <meta name="Description" content="">
  8.   <script>
  9.     function hobbyCheck( fm ){
  10.        var str="";
  11.  
  12.        //hobby항목에 선택된 value 출력하기
  13.        for(i=0; i< fm.hobby.length; i++ ){
  14.            //alert( fm.hobby[i].checked )
  15.            if( fm.hobby[i].checked ){
  16.               str += fm.hobby[i].value +" ";
  17.            }
  18.        }
  19.  
  20.        alert("당신의 취미는 " + str +" 입니다.");
  21.     }//함수끝
  22.  
  23.     function allCheck( fm ){
  24.       /*if(fm.all.checked){//전체선택이 선택되었다면
  25.          for(i=0; i< fm.hobby.length ; i++){
  26.             fm.hobby[i].checked = true;
  27.          }
  28.       }else{
  29.          for(i=0; i< fm.hobby.length ; i++){
  30.             fm.hobby[i].checked = false;
  31.          }
  32.       }*/
  33.  
  34.  
  35.      for(i=0; i< fm.hobby.length ; i++){
  36.         fm.hobby[i].checked = fm.all.checked;
  37.      }
  38.  
  39.      /*전체선택이 선택된(checekd) 경우에는 전체선택해제로 변경하고
  40.        해제된 경우에는 전체선택 으로 변경한다.
  41.      */
  42.      if(fm.all.checked){
  43.         document.getElementById("all").innerHTML ="전체해제";
  44.      }else{
  45.         document.getElementById("all").innerHTML ="전체선택";
  46.      }
  47.    
  48.     }//함수끝
  49.  
  50.  
  51.     function nationCheck(fm){
  52.       //선택된 나라 출력하기
  53.       for(i=0; i< fm.nation.length ; i++ ){
  54.           if(fm.nation[i].checked){
  55.              alert(fm.nation[i].value +"선택했음.");
  56.              break;//반복문 빠져나가라.
  57.           }
  58.       }
  59.  
  60.  
  61.     }//함수끝
  62.   </script>
  63.  </head>
  64.  
  65.  <body>
  66.  <form name="f">
  67.   <h2> 취미 선택</h2>
  68.   <input type="checkbox" name="all" value="all" onClick="allCheck(form)" />
  69.    <span id="all">전체선택</span>
  70.   <br/><br/>
  71.  
  72.   취미 :
  73.    <input type="checkbox" name="hobby" value="등산" /> 등산
  74.    <input type="checkbox" name="hobby" value="낚시" /> 낚시
  75.    <input type="checkbox" name="hobby" value="수영" /> 수영
  76.    <input type="checkbox" name="hobby" value="놀기" /> 놀기
  77.    <input type="checkbox" name="hobby" value="잠자기" /> 잠자기
  78.    <input type="checkbox" name="hobby" value="먹기" /> 먹기
  79.  
  80.    <input type="button" value="선택" onclick="hobbyCheck(form)"/>
  81.  
  82.    <hr color="red"/>
  83.  
  84.    나라선택 :
  85.    <input type="radio" name="nation" value="한국"/> 한국
  86.    <input type="radio" name="nation" value="미국"/> 미국
  87.    <input type="radio" name="nation" value="일본"/> 일본
  88.    <input type="radio" name="nation" value="중국"/> 중국
  89.    <input type="radio" name="nation" value="프랑스"/> 프랑스
  90.  
  91.    <input type="button" value="나라선택" onclick="nationCheck(form)"/>
  92. </form>  
  93.  </body>
  94. </html>

List of Articles
번호 제목 날짜 조회 수
227 이메일 체크하기 2014.03.01 5305
226 input에 background-image 이벤트 2014.03.01 5453
225 주민등록번호 체크 file 2014.03.01 6011
224 마우스대면 글자 없어지는 검색창 2014.03.01 6649
223 check box 선택시 색상 변경 file 2014.03.01 6563
222 [jQuery] 실시간 검색어 순위 순서대로 보여주기 2014.03.01 12110
221 [jQuery] 상위부터 차례로 지역 선택하기 2014.03.01 46704
220 [jQuery] 탭 메뉴 2014.03.01 6475
219 jQuery 이미지 슬라이드 오버시 큰이미지 보여주기 소스 file 2014.03.01 7056
218 (소스)jqury 롤오버 버튼 쉽게 만들기 file 2014.03.01 5880
217 top 부분이 고정되는 슬라이딩 메뉴입니다 file 2014.03.01 5837
216 [jQuery] textarea 글자수 카운트 2014.03.01 7527
215 클릭위치로 레이어 띄우기 2014.03.01 6289
214 fckeditor 2.6.6 엄청 편해졌네 file 2014.03.01 5483
213 자바스크립트 소수점 자리수 계산 2014.03.01 6968
212 div 높이 가운데정렬 2014.03.01 5691
211 javascript 인쇄 미리보기, 출력, 페이지 설정 등 2014.03.01 33023
210 iframe 자동 리사이즈 2014.03.01 6084
» 활용예제 : 체크박스 전체선택 전체해제 /라디오버튼 2014.03.01 7071
208 자바스크립트, javascript, 간단한 파일 확장자 검사후 retur 2014.03.01 5494
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 13 Next
/ 13

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

© k2s0o1d4e0s2i1g5n. All Rights Reserved