摘要：$(function(){//    默認選中第一個版本/第一個顏色    $('.detail_color_left').eq(0).attr('class','detail_color_left checked');    $('.detail_much_left').e

$(function(){

//    默認選中第一個版本/第一個顏色

    $('.detail_color_left').eq(0).attr('class','detail_color_left checked');

    $('.detail_much_left').eq(0).attr('class','detail_much_left checked');

    updateTotalPrice()

    //點擊選中其他的顏色

    $('.detail_color_left').click(function(){

        $('.detail_color_left').attr('class','detail_color_left');

        $(this).attr('class','detail_color_left checked');

        updateTotalPrice()

    });

    //點擊選中手機版本

    $('.detail_much_left').click(function(){

        $('.detail_much_left').attr('class','detail_much_left');

        $(this).attr('class','detail_much_left checked');

        updateTotalPrice();

    })

    //點擊保障服務(wù)

    $('.shop_detail_bz1').click(function(){

        var nowcircleclass=$(this).find('.fa-check-circle').attr('class');

        var nowclass=$(this).find('.fa-check-square').attr('class');

        if(nowcircleclass.indexOf('checked')>0){

            //如果存在,則移除選中;

            nowcircleclass=nowcircleclass.replace('checked','');

            nowclass=nowclass.replace('checked','');

            $(this).find('.fa-check-circle').attr('class',nowcircleclass);

            $(this).find('.fa-check-square').attr('class',nowclass);

        }else{

            //不存在, 則選中

            $(this).find('.fa-check-circle').attr('class',nowcircleclass+' checked');

            $(this).find('.fa-check-square').attr('class',nowclass+' checked');

        }

        updateTotalPrice();

    })

    //統(tǒng)計總價格

    function updateTotalPrice(){

        //版本價錢

        var bbprice=$(".detail_much_left[class$='checked']").find('span').attr('data-val')*1;

        //服務(wù)價錢

        var svprice=0;

        var svspan=$(".fa-check-circle[class$='checked']").parent('.shop_detail_bz1').find('span[data-val]');

        for(var i=0;i<svspan.length;i++){

            svprice+=svspan[i].getAttribute('data-val')*1;

        }

        //總價值

        var totalprice=bbprice+svprice;

        $('#totalPrice').html('總計&nbsp;：&nbsp;'+totalprice+'元')

        $('#phonePrice').html(bbprice+'元');

    }

})

批改老師：天蓬老師批改時間：2019-06-24 10:27:33
老師總結(jié)：這個作業(yè) , 做得不錯, 如果使用了jQuery, 建議就盡可能的用它, 除非他沒有提供的方法, 再去用原生js來解決, 你這里還用了getAttribute()就不好了, 應(yīng)該用attr()或者 prop()代替