用jQuery模擬淘寶購物車

首先我們要實現的內容的需求有如下幾點：

1.在購物車頁面中，當選中“全選”復選框時，所有商品前的復選框被選中，否則所有商品的復選框取消選中。

2.當所有商品前的復選框選中時，“全選”復選框被選中，否則“全選”復選框取消選中。

3.單擊圖標-的時候數量減一而且不能讓物品小於0並且商品總價與積分隨之改變。

4.單擊圖標+的時候數量增加並且商品總價與積分隨之改變。

5.單擊刪除所選將刪除用戶選中商品，單擊刪除則刪除該商品即可並達到商品總價與積分隨之改變。

下面我們就開始進入代碼:

 $(function () {
            
            subtotal();
            addorminus();
            allcheckbox();
            delet();
            deleselect();
        });
        //設置 獲取積分和一共金額函數
        function countmoney() {
            var money = 0;   //總金額
            var jifen = 0;   //總積分
            $(".cart_td_7").each(function () {
                var m = $(this).text();
                money += Number(m);
                var j = $(this).siblings(".cart_td_4").text();
                var number = $(this).siblings(".cart_td_6").children("input").val();
                jifen += Number(j * number);
            });
            $("#total").html(money);
            $("#integral").html(jifen);
        }
        //小計
        function subtotal() {
            var obj = $(".cart_td_7");
            obj.each(function () {                                                  //each遍歷每一個clss為.card_td_7的元素
                var num = $(this).siblings(".cart_td_6").children("input").val();   //購物車 選中的當前數量
                var price = $(this).siblings(".cart_td_5").html();                  //當前選中物品的price
                var money = num * price;                                            //小計
                $(this).html(money);
            });

            countmoney();

        }
        //添加或減少數量
        function addorminus() {
            $(".hand").on("click", function () {
                var num;
                if ($(this).attr("alt") == "minus") {
                    num = $(this).next().val();
                    if (num == 1) {
                        $(this).css("display", "none");
                    } else {
                        $(this).next().val(--num);
                    }
                } else {
                    num = $(this).prev().val();
                    $(this).prev().val(++num);
                    if (num == 1) {
                        $(this).siblings("[alt==minus]").css("display", "visible");

                    } else { }   
                }
                subtotal();
            });
        }

        //全選或者全不選
        function allcheckbox() {
            $("#allCheckBox").live("change", function () {
                if ($(this).attr("checked") == "checked") {
                    $("[name=cartCheckBox]").attr("checked", "checked");
                } else {
                    $("[name=cartCheckBox]").attr("checked", false);
                }

            });

            $("[name=cartCheckBox]").live("change", function () {
                var bool = true;
                $("[name=cartCheckBox]").each(function () {
                    if ($(this).attr("cheked") != "checked") {
                        bool = false;
                    }
                });
                if (bool) {
                    $("#allCheckBox").attr("checked", "checked");

                } else {

                    $("#allCheckBox").attr("checked", false);
                }
            });
        }
        //刪除
        function delet() {
            $(".cart_td_8>a").live("click", function () {
                $(this).parent().parent().prev().remove();
                $(this).parent().parent().remove();
                subtotal();
            });

        }
        //刪除所選 
        function deleselect() {
            $("#deleteAll>img").live("click", function () {
                $("[name=cartCheckBox]").each(function () {
                    if ($(this).attr("checked") == "checked") {
                        $(this). parent().parent().prev().remove();
                        $(this).parent().parent().remove();
                    }
                });
                subtotal();
            });
        }