wxPhone
/
shop.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <title>**店铺</title>
    <link rel="stylesheet" href="./css/same-css.css">
    <link rel="stylesheet" href="./css/shop.css">
    <link rel="stylesheet" href="./css/new_product.css">

</head>
<body>
<!--新品-->
<div class="img_box">
    <img src="./images/img03.jpg">
</div>
<!--筛选条件-->
<div class="select_box">
    <div class="ul_box">
        <ul>
            <li>综合</li>
            <li>价格
                <span class="shangXia"><img src="./images/up.png" class="down_img"></span>
            </li>
            <li>分类</li>
            <li>品牌</li>
        </ul>
    </div>
</div>
<div class="tab_box">
    <!--品牌-->
    <div class="choose_content " id="brand_content" style="display: none">
        <span class="choose_1">全部(1)</span>
        <span class="choose_1">HAPPY(2)</span>
        <span class="choose_1">DOCOMO(3)</span>
        <span class="choose_1 choose_4 ">DOCOMO(4)</span>
    </div>
    <!--分类-->
    <div class="choose_content " id="fenLei_content" style="display: none">
        <span class="choose_2">全部(1)</span>
        <span class="choose_2">wifi(2)</span>
        <span class="choose_2">电话卡(3)</span>
        <span class="choose_2">电话卡(4)</span>
    </div>
</div>
<div class="new">
    <div class="new-box">
        <div class="new-pic">
            <img src="./images/pro8.png" alt="">
        </div>
        <p class="new-title">泰国电话卡就是牛，信号就是好</p>
        <p class="old-price">原价：<span>￥29.9</span></p>
        <p class="new-price">代理价：<span class="money">￥ 29.9</span></p>
    </div>
    <div class="new-box">
        <div class="new-pic">
            <img src="./images/pro8.png" alt="">
        </div>
        <p class="new-title">泰国电话卡就是牛，信号就是好</p>
        <p class="old-price">原价：<span>￥29.9</span></p>
        <p class="new-price">代理价：<span class="money">￥ 29.9</span></p>
    </div>
    <div class="new-box">
        <div class="new-pic">
            <img src="./images/pro8.png" alt="">
        </div>
        <p class="new-title">泰国电话卡就是牛，信号就是好</p>
        <p class="old-price">原价：<span>￥29.9</span></p>
        <p class="new-price">代理价：<span class="money">￥ 29.9</span></p>
    </div>
    <div class="new-box">
        <div class="new-pic">
            <img src="./images/pro8.png" alt="">
        </div>
        <p class="new-title">泰国电话卡就是牛，信号就是好</p>
        <p class="old-price">原价：<span>￥29.9</span></p>
        <p class="new-price">代理价：<span class="money">￥ 29.9</span></p>
    </div>
    <div class="new-box">
        <div class="new-pic">
            <img src="./images/pro8.png" alt="">
        </div>
        <p class="new-title">泰国电话卡就是牛，信号就是好</p>
        <p class="old-price">原价：<span>￥29.9</span></p>
        <p class="new-price">代理价：<span class="money">￥ 29.9</span></p>
    </div>
    <div class="new-box">
        <div class="new-pic">
            <img src="./images/pro8.png" alt="">
        </div>
        <p class="new-title">泰国电话卡就是牛，信号就是好</p>
        <p class="old-price">原价：<span>￥29.9</span></p>
        <p class="new-price">代理价：<span class="money">￥ 29.9</span></p>
    </div>
</div>
<div class="bottom-love">
    收藏店铺
</div>
<script type="text/JavaScript" src="./js/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $(".select_box li").click(function () {
            var index = $(".select_box li").index(this);
            $(this).addClass("active").siblings().removeClass("active");
        });
        $(".select_box  li:eq(0)").click(function () {
            $("#brand_content").hide();
            $("#fenLei_content").hide();
        });
        $(".select_box  li:eq(1)").click(function () {
            $("#brand_content").hide();
            $("#fenLei_content").hide();
        });
        $(".select_box  li:eq(2)").click(function () {
            $("#brand_content").toggle();
            $("#fenLei_content").hide();
        });
        $(".select_box  li:eq(3)").click(function () {
            $("#fenLei_content").toggle();
            $("#brand_content").hide();
        });
        $(".new-box").click(function () {
            window.location.href = './me-shop-detail.html';
        })
    });

    //品牌里面的小选项
    $(document).ready(function () {
        $(".choose_content .choose_1").click(function () {
            removeALL();
            $(this).addClass("choose_1_active");
            $(".choose_content").hide();
        });
    });
    function removeALL() {
        $('.choose_1').removeClass("choose_1_active");
    }
    //分类里面的小选项
    $(document).ready(function () {
        $(".choose_content .choose_2").click(function () {
            removeALL();
            $(this).addClass("choose_1_active");
            $(".choose_content").hide();
        });
    });
    function removeALL() {
        $('.choose_2').removeClass("choose_1_active");
    }
</script>
</body>
</html>