jquery操作checkbox

2018-07-20 来源：open-open

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>

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点！
本站所提供的图片等素材，版权归原作者所有，如需使用，请与原作者联系。

上一篇:Python将阿拉伯数字转化为中文大写

下一篇:压栈出栈遍历栈实例代码

最新资讯

热门推荐