detail.html 3.8 KB

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_834805_9xhwk34nlhw.css">
    <link rel="stylesheet" href="__INDEX__/css/base.css">
    <link rel="stylesheet" href="__INDEX__/css/goodinfo_detail.css">
    <link rel="stylesheet" href="__INDEX__/css/swiper.min.css">
    <script type="text/javascript" src="__INDEX__/js/base.js" charset="utf-8"></script>
    <title>商品详情</title>
</head>
<body>
<div class="container">
    <div class="good_head">
        <img src="{$data.thumb}" alt="">
    </div>
    <div class="good_info">
        <p class="good_name">
            {$data.name}
        </p>
        <p class="good_num">
            {$data.intro}
        </p>
        <div class="people">
            <p class="people_weight">
                购买可获得40积分
            </p>
            <p class="people_money">
                ¥{$data.price}
            </p>
        </div>
    </div>
    <div class="line"></div>
    <div class="good_content">
        <p class="active" id="1">
            <em></em>
            图文详情
        </p>
        <p id="2">
            <em></em>
            评价
        </p>
    </div>
    <div class="goodinfodetail">

        <div class="good_detail_info">
            <p class="product">商品信息</p>
            <div class="good_info_img">
                {$data.content}
            </div>
        </div>
    </div>
    <div class="evalute"  style="display:none">
        <div class="evalute_list">
            <div class="evalute_people">
                <p class="people_img">
                    <img src="__INDEX__/img/people.png" alt="">
                </p>
                <div class="people_info">
                    <p class="people_name">向昱筱</p>
                    <p class="people_date">2018-03-09</p>
                </div>
            </div>
            <div class="evalute_text">
                颜值高口感好,很新鲜,奶油一点都不腻,超清爽的口
                感,奶香味很浓,非常喜欢。
            </div>
        </div>
        <div class="evalute_list">
            <div class="evalute_people">
                <p class="people_img">
                    <img src="__INDEX__/img/people.png" alt="">
                </p>
                <div class="people_info">
                    <p class="people_name">向昱筱</p>
                    <p class="people_date">2018-03-09</p>
                </div>
            </div>
            <div class="evalute_text">
                质量很好,很好的一次购物,味道不错!
            </div>
        </div>
    </div>
    <div class="foot">
        <div class="cartnum">
            <p class="goodcart">
                <img src="__INDEX__/img/goodcart.png" alt="">
            <p class="num">12</p>
            </p>
        </div>
        <p class="addcart">加入购物车</p>
        <p class="buynow">立即购买</p>
    </div>
</div>
<script src="__INDEX__/js/jquery.min.js"></script>
<script>
    $(".good_content p").click(function(){
        console.log($(this).html())
        $(this).addClass("active");
        $(this).siblings("p").removeClass("active");
        if($(this).attr("id")==1){
            $(".goodinfodetail").css("display","block");
            $(".evalute").css("display","none")

        }else if($(this).attr("id")==2){
            $(".evalute").css("display","block");
            $(".goodinfodetail").css("display","none");
        }
    })
    //立即购买
    $(".buynow").click(function(){
        window.location.href='order.html'
    })
    //加入购物车
    $(".addcart").click(function(){
        window.location.href='__INDEX__/shopcar/cart.html'
    })
</script>
</body>
</html>