zoukankan      html  css  js  c++  java
  • 购物车数量加减代码

    .amount-wrap .icon{
        display: inline-block;
        width: 28px;
        height: 28px;
        line-height: 28px;
        text-align: center;
        border: 1px solid #cdcdcd;
        background-color: #eee;
        vertical-align: middle;
    }
    .amount-wrap .icon-minus {
        border-right: 0;
    }
    .amount-wrap .icon-plus {
        border-left: 0;
    }
    .amount-wrap input {
        width: 40px;
        margin-bottom: 0;
        text-align: center;
        vertical-align: middle;
    }
    <td class="amount-wrap"><a href="#" class="icon icon-minus"></a><input type="text" value="1"><a href="#" class="icon icon-plus"></a></td>
    $('#orderList').find('input[type="text"]').on('keyup paste input',function(){
            this.value = ~~this.value.replace(/D/g,''); // onkeyup="this.value=this.value.replace(/[^0-9]*/,'')" 
            if(this.value == '') this.value = 0;
            setTotal();
        });
        $('#selectList').on('keyup paste input','input[type="text"]',function(){
            this.value = ~~this.value.replace(/D/g,'');
            if(this.value == '') this.value = 0;
            setTotal();
        });
        $('#orderList .minus').on('click',function(e){
            e.preventDefault();
            var t = $(this).parent().find('input[type="text"]')
                ,tit = $(this).parents('li').find('h2 > a').html()
                ,price = $(this).parents('li').find('span.order-price > i').html()
                ,pid = $(this).parents('li').attr('id')
                ,index = $(this).parents('li').index()
                ,catid = $('.swiper-nav').find('.swiper-slide').eq(index).data('catid')
                ,cattit = $('.swiper-nav').find('.swiper-slide').eq(index).find('.title').html()
                ,$hasPid = $("#selectList").has('#s-'+ pid);
            if(parseInt(t.val()) > 0 ){
                t.val(parseInt(t.val())-1);
            }
            if($hasPid){
                if(parseInt(t.val()) == 0){
                    $('#s-'+ pid).remove();
                }else{
                    $('#s-'+ pid).find('input[type="text"]').val(parseInt(t.val()));
                }
            }
            setTotal();
        });
        $('#orderList .plus').on('click',function(e){
            e.preventDefault();
            var t = $(this).parent().find('input[type="text"]')
                ,tit = $(this).parents('li').find('h2 > a').html()
                ,price = $(this).parents('li').find('span.order-price > i').html()
                ,pid = $(this).parents('li').attr('id')
                ,index = $(this).parents('.swiper-slide').index()
                ,catid = $('.swiper-nav').find('.swiper-slide').eq(index).data('catid')
                ,cattit = $('.swiper-nav').find('.swiper-slide').eq(index).find('.title').html()
                ,$hasPid = $("#selectList").has('#s-'+ pid).length;
            t.val(parseInt(t.val())+1);
            if($hasPid){
                $('#s-'+ pid).find('input[type="text"]').val(parseInt(t.val()));
            }else{
                var _html = '<li id="s-'+pid+'">'+
                    '<a href="#" class="tit">【'+cattit+'】'+tit+'</a><span class="order-price pull-right">¥<i>'+price+'</i></span>'+
                    '<div class="clearfix selected-btm">'+
                    '<a href="#" class="icon-del"></a>&nbsp;&nbsp;&nbsp;&nbsp;'+
                    '<div class="order-amount pull-right">'+
                    '<a href="#" class="minus"></a>'+
                    '<input type="text" value="'+parseInt(t.val())+'">'+
                    '<a href="#" class="plus"></a>'+
                    '</div>'+
                    '</div>'+
                    '</li>';
                $("#selectList ul").append(_html);
            }
            setTotal();
        });
    
        $('#selectList').on('click','.plus',function(e){
            e.preventDefault();
            var $this = $(this)
                ,$parentLi = $this.parents('li')
                ,$pid = $parentLi.attr('id').replace('s-','');
            var t = $this.parent().find('input[type="text"]');
            t.val(parseInt(t.val())+1);
            $('#'+$pid).find('input[type="text"]').val(t.val());
            setTotal();
        });
        $('#selectList').on('click','.minus',function(e){
            e.preventDefault();
            var $this = $(this)
                ,$parentLi = $this.parents('li')
                ,$pid = $parentLi.attr('id').replace('s-','');
            var t = $this.parent().find('input[type="text"]');
            if(parseInt(t.val()) == 1){
                $this.addClass('disable');
                return false;
            }
            t.val(parseInt(t.val())-1);
            $('#'+$pid).find('input[type="text"]').val(t.val());
            setTotal();
        });
        $('#selectList').on('click','.icon-del',function(e){
            e.preventDefault();
            var $this = $(this)
                ,$parentLi = $this.parents('li')
                ,$pid = $parentLi.attr('id').replace('s-','');
            $parentLi.remove();
            $('#'+$pid).find('input[type="text"]').val(0);
            setTotal();
        });
    
        function setTotal(){
            var moneyTotal = 0, numTotal = 0;
            var date = new Date();
            date.setTime(date.getTime() + (1 * 24 * 60 * 60 * 1000));
            $("#orderList li").each(function(){
                var $this = $(this)
                    ,numVal = $this.find('input[type="text"]').val()
                    ,pid = $this.attr('id');
                if ( numVal > 0) {
                    moneyTotal += parseInt(numVal)*parseFloat($(this).find('span.order-price>i').text());
                    numTotal += parseInt(numVal);
    
                    $.cookie(pid,numVal,{path:path,expires:date});
                    $.cookie('mTotal',moneyTotal,{path:path,expires:date});
                    $.cookie('nTotal',numTotal,{path:path,expires:date});
                }else {
                    $.cookie(pid,null,{ path: path,expires:-1});
                }
            });
    
            if($("#selectList ul li").length == 0){
                $("#selectList").hide();
            }else{
                $("#selectList").show();
            }
            $("#moneyTotal").html(moneyTotal.toFixed(2));
            $("#numTotal").html(numTotal);
            $("#moneyTotal2").html(moneyTotal.toFixed(2));
            $("#numTotal2").html(numTotal);
        }
        $('.amount-wrap').find('input[type="text"]').on('keyup paste input',function(){
            this.value = ~~this.value.replace(/D/g,'');
            if(this.value == '') this.value = 0;
        });
        $('.amount-wrap').on('click','.icon-plus',function(e){
            e.preventDefault();
            var $this = $(this)
                ,$parent = $this.parent()
                ,$input = $parent.find('input[type="text"]');
            $input.val(parseInt($input.val())+1);
            $this.siblings('.icon-minus').removeClass('disable');
        });
        $('.amount-wrap').on('click','.icon-minus',function(e){
            e.preventDefault();
            var $this = $(this)
                ,$parent = $this.parent()
                ,$input = $parent.find('input[type="text"]');
            if(parseInt($input.val()) == 1){
                $this.addClass('disable');
                return false;
            }
            $input.val(parseInt($input.val())-1);
        });
  • 相关阅读:
    Java中的数据类型
    java中变量的分类
    软考视频总结(二)——细化学习A
    软考视频总结(一)——蜕变
    Eclipse汉化
    IIS 服务或万维网发布服务,或者依赖这两种服务的某个服务未能启动。
    jQuery--编辑表格
    MVC之查询demo
    初识MVC之建项
    附加数据库 对于服务器 XXX失败
  • 原文地址:https://www.cnblogs.com/anyaran/p/4212544.html
Copyright © 2011-2022 走看看