码迷,mamicode.com
首页 > 其他好文 > 详细

购物车数量加减代码

时间:2015-01-09 10:39:56      阅读:205      评论:0      收藏:0      [点我收藏+]

标签:

.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,‘‘);
        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);
    }

 

购物车数量加减代码

标签:

原文地址:http://www.cnblogs.com/anyaran/p/4212544.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!