jQuery实现购物车功能

我写的这篇文章呢，主要功能就是可以减少或者添加商品数量，并且自动计算商品总价格，我是后台程序员，前台的知识就相对弱一些，所以我就记录下来这些前台知识，也希望这篇文章可以帮助到大家。

    <div class="spXx">
            <!--左界面-->
            <div class="xxLeft">
                <div class="xmPic">
                    <img src="<%=path %><s:property value="stockitemInfo.coverImg"/>"/>
                </div>
                <p class="btt">${stockitemInfo.itemTitle}</p>
                <p>起投金额：<span>${stockitemInfo.lowest}</span> 元/份</p>
                <p>剩余份数：<span>${stockitemInfo.surplusCopies}</span> 份</p>
                <input type="hidden" id="lowest" value="${stockitemInfo.lowest}"/>
                <input type="hidden" id="surplusCopies" value="${stockitemInfo.surplusCopies}"/>

            </div>
            <!--右界面-->
            <div class="xxRight">
                <form id="save" method="post" action="modindex/stockOrder_saveStock.do">
                    <input name="stockJoin.userId" type="hidden" value="<s:property value="#session.userVo.id" />"/>
                    <input name="stockJoin.stockitemId" type="hidden" value="${stockId}"/>
                    <input name="stockitemInfo.itemTitle" type="hidden" value="${stockitemInfo.itemTitle}" />
                    <input name="stockJoin.payMoney" id="total1" type="hidden" value="${stockitemInfo.lowest}"/>

                    <div class="tt">
                        <label>认购份数：</label>
                        <div class="qty">
                            <button type="button" class="minus"> - </button>
                            <input type="text" for="mainselector-Num" class="qty_val" value="1" maxlength="3" 
                            onKeyUp="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')"/>
                            <button type="button" class="plus"> + </button>

                        </div>
                    </div>
                    <div class="tt">
                        <label>认购金额：</label>
                        <div class="rgje">
                            <span><span id="total">${stockitemInfo.lowest}</span>元</span>
                            账户可用余额￥<s:if test="bv.money==null || bv.money==''">0</s:if><s:else>${bv.money}</s:else>元
                        </div>
                    </div>
                    <div class="tt">
                        <div class="lit">
                            <input id="read" class="hei" type="checkbox" checked="checked" />
                            我已经认真阅读并同意<a href="">《风险提示书》</a>相关条款
                        </div>
                    </div>
                    <div class="tt">
                        <s:if test="stockitemInfo.surplusCopies>0">
                            <a class="cjj" onclick="saveOrder()">支付并签署协议</a>
                        </s:if>
                        <s:else>
                            <a class="cjj" style=" background:gray" >已认购完毕</a>
                        </s:else>
                    </div>  
                </form>
            </div>
            <div class="clear"></div>
        </div>

<script>
        function initNumChangeEvent() {
            $('.qty_val').on("input propertychange", function () {
                var selector = $(this).attr('for').split('-')[0];
                /* NumChange(selector, $(this).val()); */
            });
        }
        function initPlusMinusEvent() {
            $('.qty_val').blur(function () {
                if ($(this).val() == '') {
                    $(this).val(1);
                };
                if ($(this).val() == '0') {
                    $(this).val(1);
                };
                var surplusCopies=document.getElementById("surplusCopies").value;
                if ($(this).val() > surplusCopies) {
                    alert("认购份数不可大于剩余份数");
                    $(this).val(1);
                };

            });
            $('.plus').click(function () {
                var newObj = $(this).parent().find('.qty_val');
                var s = newObj.val();//获得同一index的元素的值
                var surplusCopies=document.getElementById("surplusCopies").value;
                if (parseInt(s) < surplusCopies) {
                    newObj.val(parseInt(s) + 1); //做加法
                    sum(parseInt(s)+1);
                    var selector = $(this).parent().find('.qty_val').attr('for').split('-')[0];
                    /* NumChange(selector, parseInt(s) + 1); */

                }else{
                    alert("认购份数不可大于剩余份数");
                }
            });
            $('.minus').click(function () {
                var newObj = $(this).parent().find('.qty_val');
                var s = newObj.val();
                if (s > 1) {
                    newObj.val(parseInt(s) - 1);
                    sum(parseInt(s)-1);
                    var selector = $(this).parent().find('.qty_val').attr('for').split('-')[0];
                    /* NumChange(selector, parseInt(s) - 1); */

                };
            });
        }

        $(function () {
            initNumChangeEvent();
            initPlusMinusEvent();
        });


        //计算
        function sum(dom){
            var lowest=document.getElementById("lowest").value;
            var totalMoney=dom*lowest;
            $("#total").text(totalMoney);      //给total赋值
            $("#total1").val(totalMoney);      //取total值
        }


        function saveOrder(){
            if(document.getElementById('read').checked==false){
                alert("请阅读并同意《风险提示书》相关条款");
            }else{
                $("#save").submit();
            }
        }

</script>

来给大家简单解释一下，起投金额就是最低投资数，也就是1份的钱数，剩余份数是通过后台计算出来的，这里不做展示；认购金额要随着认购份数的变化而计算出价格，且认购份数不可大于剩余份数
代码也简单解释一下：
1、(‘.plus’).click(function (){})为加号按钮注册click事件处理函数；(‘.minus’).click(function () {})同理
2、function sum(dom){}计算出两数之积，sum(parseInt(s)+1)点击加号时，计算出总钱数
3、function saveOrder(){}是让用户必须勾选checkbox才可提交表单，跳转到下一步

其实我这里还是有好几处漏洞的，心细的同志们是一定会发现的，不过我在这里先不指出来，如果有想知道漏洞在何处，和解决办法的，可以私我，也可以留言，谢谢大家