jquery操作checkbox示例分享

字號:


    checkbox操作
    1. 全選、全不選
    2.打印所有的選中項目
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "">
    <html>
     <head>
     <title> </title>
     <script type="text/javascript" src="jquery-1.3.2.js"></script>
     <script>
     // 全選、全不選
     function docChkBoxChange(){
      var isChecked = jQuery('#docChkBoxTop').attr('checked');
      // 設(shè)置以下所有的 checkBox 列表
      jQuery("input[name=docChkBox]").each(function(){
      this.checked = isChecked;
      });
     }//end function
     // 打印所有的選中項目
     function printChoose(){
      var isChecked = jQuery('#docChkBoxTop').attr('checked');
      // 設(shè)置以下所有的 checkBox 列表
      jQuery("input[name=docChkBox]").each(function(){
      if(this.checked){
      alert(this.value)
      }
      });
     }//end function
     </script>
     </head>
     <body>
     <table>
     <tr>
     <td>
      <input id='docChkBoxTop' type="checkbox" onClick='docChkBoxChange()'>全選、全不選
     </td>
     </tr>
     <tr>
     <td>
      <input name='docChkBox' type="checkbox" value='apple'>蘋果
     </td>
     </tr>
     <tr>
     <td>
      <input name='docChkBox' type="checkbox" value='banana'>香蕉
     </td>
     </tr>
     <tr>
     <td>
      <input type="button" value='打印所有選中項' onClick='printChoose()'>
     </td>
     </tr>
     </table>
     </body>
    </html>