一個checkbox 用jquery實現全選、全不選

之前因為一個很小的錯誤弄了很久，現在才做好。

效果圖：

肯定還有更簡單的方法。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Checkbox.aspx.cs" Inherits="WebApp.Test.Checkbox" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="../Scripts/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
        $(function () {
            jQueryCheckAll();
        })
        function jQueryCheckAll() {
            var checkAll = $('#checkedAll');
            var items = $(':checkbox[name=item]');
           
            checkAll.click(function () {
                if ($(this).attr('checked')) {
                    items.each(function () {
                        $(this).attr('checked', true);
                    })                  
                }
                else {
                    items.each(function () {
                        $(this).attr('checked', false);
                    })
                }
                items.click(function () {
                    checkAll.attr("checked", items.length == $(':checkbox[name=item]:checked').length ? true : false);
                });
            })      
        }      
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            你愛好的運動是？
            <input type="checkbox" id="checkedAll"/>全選/全不選<br/>
            <input type="checkbox" name="item" value="足球" />足球
            <input type="checkbox" name="item" value="籃球" />籃球
            <input type="checkbox" name="item" value="羽毛球" />羽毛球
            <input type="checkbox" name="item" value="乒乓球" />乒乓球
        </div>
    </form>
</body>
</html>