//체크박스 전부다 선택하기

  function allcheck() {
   var checkbox = event.srcElement;  // allcheck()란 이벤트 핸들러에게 이벤트를 발생시킨 객체를 checkbox안에 담는다.
   if( checkbox.checked ) {              // 만약 호출한 inputBox에 checked 면  
    allBoxCheck(true);                      // 모든박스 inputBox를 체크한다. allBoxCheck()함수는 아래에 정의
   } else {
    allBoxCheck(false);                    //체크가 안 되어 있으면 모두 체크 해제.,//끝!!
   }
   }
  
  function allBoxCheck(val) {                      //위의 allcheck()함수에서 사용한다.
   var allInput = document.all.tags("INPUT"); //문서의 모든 태그중 "INPUT"이라고 한거를 다 allInput 에 담는다.
   for( var i=0 ; i<allInput.length ; i++ ) {       //그 담은 길이 만큼 돌아~   돌~리고~~ 돌리~고~
    var input = allInput[i];                           //그 각각의 allInput의[i]번째를 input에 담아
    if( input.type == "checkbox" ) {              //그 input의 type이 checkbox인지를 비교한다
     input.checked = val;                            //checkBox가 맞은면 checked에 val을 대입한다.
    }                                                       //val은 allcheck()에서 호출시allBoxCheck(true & false)지정!!      //
   }
  }


  // 큰제목 전체선택 아래 소제목 전체 선택하기
  function childCheck() {
   var input = event.srcElement;    //현재childCheck()함수를 부른 이벤트를 input 에 담는다.값은alert(event.srcElement);              //[object]가 찍힌다.
   var checked = input.checked    //input박스가 체크되어 있으면 true 아니면 false반환한다.

alert(input.checked);                  // true or false 가 찍힌다.
   var td = input.parentElement;    // input의 부모(input을 감싼 태그를 말한다)는 td
   var tr = td.parentElement;         // td의 부모(위 td 를 감싼 태그를 말한다)는 tr
   var index = tr.rowIndex;           // 그래서 그 tr의 로우 (몇번째 행인지)를 찾는다.

alert(tr.rowIndex);                      // 해당 로우가 찍힌다.
   if( index < 3 ) return;               // 나는 3번째 로우 부터 선택 하므로 3번째 이전의 로우는 리턴
   var checkTable = document.all.checkTable;                           //모든 checkTable을 담는다[]
   var targetTable = checkTable[index-3];                                 //거기서3번째를 찾아 담는다
   var targetInput = targetTable.getElementsByTagName("INPUT");//3번째에서"INPUT"을 찾아 담는다.
   for( var i=0 ; i<targetInput.length ; i++ ) {    //targetInput 배열에 담긴 모든 input을 하나씩 뺀다.
    var input = targetInput[i];                        //targetInput의[i]번째 input을 input에 담고  
    if( input.type == "checkbox" ) {                //그 input 의 type이 checkbox인지를 비교한다.
     input.checked = checked;                     //input.checked 를 checked로 설정...//  끝!!
    }
   }
  }


childCheck()는 각 소 재목의 테이블 마다 동일한 ID를 입력해야 한다

<table id="checkTable" >

<input type="checkbox"  onclick="childCheck()" >

반응형

'Information' 카테고리의 다른 글

구글어스 플래시 버젼  (0) 2007.03.16
CSS-Based Navigation Menus: Modern Solutions  (0) 2007.03.15
비스타 하드웨어 ‘체크포인트’  (0) 2007.03.13

+ Recent posts