2011-09-21 3 views
4

사용자가 "모두 선택"버튼을 클릭하면 페이지의 모든 확인란을 선택하기 만하면됩니다.jQuery로 모든 확인란 선택

<button id="checkall">Select All</button> 

jQuery를 :

<head> 

    <script type="text/javascript" src="js/jquery.js"></script> 

    <script type="text/javascript"> 
    $(document).ready(function(){ 
     $('#checkall').click(function() { 
      $("input[type=checkbox]").each(function() { 
      $(this).attr('checked', true); 
     }); 
    }); 
    </script> 
</head> 

그리고 체크 박스는 PHP의 작은 비트에 의해 생성됩니다 몸에서

echo '<li>'; 
echo '<input type="checkbox" name="checkbox[]" value="'.$x.'" />'.$x.'<br/>'; 
echo '</li>'; 

아무도 내가 '무엇을 말해 줄 수 잘못하고있는거야?

답변

10

각 설명이 필요하지 않습니다. 모든 체크 박스를 선택하고 속성 checked = true을 설정하십시오.

$(document).ready(function(){ 
    $('#checkall').click(function() { 
     $("input:checkbox").prop('checked', true); 
    }); 
}); 

참고 jQuery.prop()은 1.6 이상에 추가 된 기능입니다. 1.6 이전의 jQuery 버전을 사용하고 있다면 다음이 필요합니다. 대신 더 나은 태그 이름으로 확인란을 선택 그것을 몇 가지 클래스를 지정하고 클래스 명

$(document).ready(function(){ 
     $('#checkall').click(function() { 
      $(".checkbox").each(function(i,chkbox) { 
      $(chkbox).attr('checked', true); 
     }); 
    }); 
    }); 

PHP 코드

    echo '<li>'; 
       echo '<input type="checkbox" class="checkbox" name="checkbox[]" value="'.$x.'" />'.$x.'<br/>'; 
       echo '</li>'; 
+0

곰. 선택을 취소하려면 추가 코드가 필요합니다. –

+1

그건 속임수 였어. 무리 감사!! –

+1

문제 없습니다 ... 기꺼이 도와 드리겠습니다. 정답을 수락하십시오. –

1

! 오류가 없습니다.

$(document).ready(function() { 
    $('#checkall').click(function() { 
     $("input[type=checkbox]").each(function() { 
      $(this).attr('checked', 'checked'); 
      // or 
      // $(this).attr('checked', true); 
     }); // you missed this one!!! 
    }); 
}); 
+0

이것은 여전히 ​​하나의'});'너무 적습니다.'.each'는 여기서 중복됩니다. – pimvdb

+0

제안에 감사드립니다. –

0

당신은 단지 .each(function(){} 문에 대한 });를 그리워과 선택의

$(document).ready(function(){ 
    $('#checkall').click(function() { 
     $("input:checkbox").attr('checked','checked'); 
    }); 
}); 
+0

'jQuery.each()'는 필요하지 않습니다. –

0

이 작동합니다, 이것은 단지의 체크 박스를 선택합니다 마음에 짧은하고 편리한 코드

<script> 
    $('#check_all').click(function() { 
    $(this).closest('form').find(':checkbox').prop('checked' , this.checked ? true : false); 
}) 
</script>