第二種 複選框的寫法

 <form method="post" action="">
        你愛好的運動是?
        <input type="checkbox" id="CheckedAll" />全選/全不選
        <br/>
        <input type="checkbox" name="items" value="足球" />足球
        <input type="checkbox" name="items" value="籃球" />籃球
        <input type="checkbox" name="items" value="羽毛球" />羽毛球
        <input type="checkbox" name="items" value="乒乓球" />乒乓球
        <br/>
        <input type="button" id="send" value="提 交" />
    </form>
 <script type="text/javascript" src="jquery-1.7.js"></script>
    <script type="text/javascript">
    jQuery.noConflict();
    (function($) {
        $('#CheckedAll').click(function() {
            $('[name=items]:checkbox').prop('checked', this.checked);
        });

        // $('[name=items]:checkbox').click(function() {
        //     var $tmp = $('[name=items]:checkbox');
        //     $('#CheckedAll').prop('checked', $tmp.length == $tmp.filter(':checked').length);
        // });

        /*思路二*/
        $('[name=items]:checkbox').click(function() {
            var flag = true;
            var $tmp = $('[name=items]:checkbox');
            $tmp.each(function(index, el) {
                if (!this.checked) {
                    flag = false;
                }
            });
            $('#CheckedAll').prop('checked', flag);
        });

    })(jQuery);
    </script>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章