input checkbox 모두 체크하기

by 조쉬 posted Mar 26, 2021
?

단축키

Prev이전 문서

Next다음 문서

ESC닫기

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

최근 jquery를 사용하면서 소스의 양도 줄어들고, 쓸데 없이 for문을 잔뜩 돌릴일도 없어지고, 덕분에 소스의 실행속도 까지 빨라지는거 같아서 참 흡족해 하고 있다.
그러는 와중에 필자가 항상 for문을 돌려가며 사용했던 모두 체크 기능을 jquery로는 간단하게 구현 가능하기에 한번 소개 해보려고 한다.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>

<script type="text/javascript">
$( function(){
  $('#chk_all').click( function(){
    if( $(this).val() == 1 ) 
    {
      $('.chk').attr("checked", "checked");
      $(this).val( 0 );
    }
    else 
    {
      $('.chk').removeAttr("checked");
      $(this).val( 1 );
    }
  });
});
</script>

<input type="checkbox" name="chk_all" id="chk_all" value="1"><br><br>

<input type="checkbox" class="chk" name="chk1" id="chk1" value=""><br>
<input type="checkbox" class="chk" name="chk2" id="chk2" value=""><br>
<input type="checkbox" class="chk" name="chk3" id="chk3" value=""><br>
<input type="checkbox" class="chk" name="chk4" id="chk4" value=""><br>
 






간단한 것이니 따로 설명은 안하겠다.