返回jquery操......登陆

jquery操作checkbox

阿神2016-11-08 10:57:54368

checkbox操作

1. 全选、全不选

2.打印所有的选中项目

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
 <head>  
  <title>  </title>  
  <script type="text/javascript" src="jquery-1.3.2.js"></script>  
  <script>  
    // 全选、全不选  
    function docChkBoxChange(){  
         var isChecked = jQuery('#docChkBoxTop').attr('checked');  
         // 设置以下所有的 checkBox 列表  
         jQuery("input[name=docChkBox]").each(function(){  
            this.checked = isChecked;  
         });  
    }//end function  
    // 打印所有的选中项目  
    function printChoose(){  
         var isChecked = jQuery('#docChkBoxTop').attr('checked');  
         // 设置以下所有的 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>


最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送