分类界面 大分类小分类

<div class="v27 hide  ">
    <div class="v28">
        <div class="v29">
            <div class="v32">大类 :</div>
            <div class="v33">
                <input type="hidden" value="" class="dtype demo" id="dtype">
                <input type="hidden" value="" class="mtype demo" id="mtype">
                <input type="hidden" value="" class="biao demo" id="biao">
                <?php  foreach($maxtype as $k=>$vo){ if($vo['id']==$pid){ ?>
                <a href="#" id="<?php  echo  $vo['id']?>" cid="{$vo.id}" style="color:rgb(69, 156, 154);" class="test">
                    <?php   }else{ ?>
                    <a href="#" id="{$vo.id}" cid="{$vo.id}" style="color: rgba(0, 0, 0, 0.647058823529412);"
                       class="test">
                        <?php  }  ?>
                        <div class=" a1 " style="margin-left: 3rem;;">{$vo.name}</div>
                    </a>
                    <?php }?>
            </div>
        </div>
        <div class="v29">
            <div class="v32">小类 :</div>
            <div class="v33" id="min">


                <volist name="mintype" id='vvo'>
                    <?php   if($vvo['id']==$sid){?>
                    <a href="#" xid="{$vvo.id}" cid="{$vo.id}" style="color:rgb(69, 156, 154);" class="test2">
                        <?php   }else{ ?>
                        <a href="#" xid="{$vvo.id}" cid="{$vvo.id}" style="color: rgba(0, 0, 0, 0.647058823529412);"
                           class="test2">
                            <?php  }  ?>
                            <div class="mintype" style="margin-left: 3rem;">{$vvo.name}</div>
                        </a>

                </volist>
            </div>
        </div>
        <div class="v29">
            <div class="v32">标准 :</div>
            <div class="v33 "  id="main">
                <volist name="standard" id='vv'>
                    <a href="#" class="test3" >
                        <div class="zhun pt"   bid="{$vv.id}"        style="margin-left: 3rem;">
                            {$vv.standard}
                        </div>
                    </a>
                </volist>

            </div>
        </div>
    </div>





script：

$(document).on('click', ".test", function () {
    id = $(this).attr('id');

    $(".test").css('color', 'rgba(0, 0, 0, 0.647058823529412)')
    $(this).css('color', '#459c9a')

    // $("."+id).addClass("active1")
    // $(".a1").removeClass("v34")
    maxid = $('.dtype').val(id);
    mtype = document.getElementById("mtype").value;
    biao = document.getElementById("biao").value;
    $("#mtype").val("");
    $("#biao").val("");

    $.ajax({
        url: "min",
        type: "post",
        dataType: "json",
        data: {
            id: id,

        },
        success: function (data) {

            str = '';
            $.each(data, function (k, v) {
                str += '<a href="#"          val="a2"><div class="mintype "      id="' + v.id + '"   style="margin-left: 2rem;color: rgba(0, 0, 0, 0.647058823529412);"><span>' + v.name + '</span></div></a>'

            });
            $("#min").html(str);

        }
    })
})

$(document).on('click', '.mintype', function () {
    var min_id = $(this).attr('id')
    minid = $('.mtype').val(min_id);
    $(".mintype").css('color', 'rgba(0, 0, 0, 0.647058823529412)')
    $(this).css('color', '#459c9a')
})