【前端】复选框全选实现方法

来源：互联网发布：pdb数据库怎么用编辑：程序博客网时间：2024/05/29 15:24

这里写图片描述

源代码

<html>    <head>        <meta charset="utf-8" />        <script type="text/javascript" src="jquery-1.7.1.min.js"></script>        <script>            $(document).ready(function(){                $("[name='allSel']").click(function(){                    if($(this).is(':checked')){                        $("[name='select']").attr('checked',true);                    }else{                        $("[name='select']").attr('checked',false);                    }                })                $("[name='select']").click(function(){                    var allSel = false;                    $("[name='select']").each(function(){                        if(!$(this).is(':checked')){                            allSel = true;                        }                    })                    if(allSel){                        $("[name='allSel']").attr('checked',false);                    }else{                        $("[name='allSel']").attr('checked',true);                    }                })            });        </script>    </head>    <body>        <input type="checkbox" name="allSel" />全选        <hr />        <input type="checkbox" name="select" value="1"/>1</br>        <input type="checkbox" name="select" value="2"/>2</br>        <input type="checkbox" name="select" value="3"/>3</br>        <input type="checkbox" name="select" value="4"/>4</br>        <input type="checkbox" name="select" value="5"/>5</br>    </body></html>

参考讲解代码

阅读全文

0 0