Jquery---checkbox的全選或者全部取消

    checkbox是我們在系統開發中不可避免地要使用的一個控件。通常的用法就是,任意選中多個checkbox、全選或者全部取消。前段時間剛又碰到了checkbox這方面的用法。幾天就抽點時間,簡單地總結一下,希望給想要使用checkbox控件的朋友們一點兒幫助。

    有時候我們要點擊一個checkbox控件,它被選中時,其它checkbox全部被選中,再點擊它,即取消選中它,其它checkbox全部被取消選中。這時候我們就可以在HTML或者.jsp文件中使用如下代碼來實現此功能。代碼如下:

<html> 
<body> <input type="checkbox" name="ckb" value="1"/><span>蘋果</span> <input type="checkbox" name="ckb" value="2"/>橘子 <input type="checkbox" name="ckb" value="3"/>梨子 <input type="checkbox" name="ckb" value="4"/>香蕉 <button id="all_checked" type="button">全選</button> <button id="all_uncheck">反選</button> </body>  <script type="text/javascript">    $(document).ready(function(){    $('#all_checked').click(function(){    $('input:checkbox[name="ckb"]').each(function() {    $(this).prop('checked',true);    });    });    $('#all_uncheck').click(function(){    $('input:checkbox[name="ckb"]').each(function () {         $(this).prop('checked',false); });    })       })           </script>
</html>選中了複選框checkbox,那麼如何獲取被選中的複選框checkbook的值呢?

function jqchk(){ //jquery獲取複選框值 
var chk_value =[]; 
$("input[name="ckb"]:checked").each(function(){ 
chk_value.push($(this).val()); 
}); 
alert(chk_value.length==0 ?'你還沒有選擇任何內容!':chk_value); 
} 
以上就是checkbox常用的幾個功能,希望能給小夥伴們一點幫助。



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章