<div class="col-md-4 mt">                                        <div class="friend-list">                                            <h4 class="title" id="fri-title"><i class="fa fa-angle-down" id="i-icon"></i>选择收件人</h4>                                            <ul class="list-group max-he" id="friend">                                                <!--<volist name="list" id="row">-->                                                <li class="list-group-item fri-group">                                                    <a href="#" class="inactive">我的好友</a>                                                    <ul style="display:none;" class="group-fri">                                                        <!--<volist name="row[‘childList‘]" id="rowtwo">-->                                                        <li><a href="javascript:void(0);" id="setvalue"><p class="conceal"><img src="http://placehold.it/30x30"/>123456789</p></a></li>                                                        <li><a href="javascript:void(0);" id="setvalue"><img src="http://placehold.it/30x30"/>小明</a></li>                                                        <!--</volist>-->                                                    </ul>                                                </li>                                                <li class="list-group-item fri-group">                                                    <a href="#" class="inactive">我的好友</a>                                                    <ul style="display:none;" class="group-fri">                                                        <!--<volist name="row[‘childList‘]" id="rowtwo">-->                                                        <li><a href="javascript:void(0);" id="setvalue"><p class="conceal"><img src="http://placehold.it/30x30"/>电话</p></a></li>                                                        <li><a href="javascript:void(0);" id="setvalue"><img src="http://placehold.it/30x30"/>小明</a></li>                                                        <!--</volist>-->                                                    </ul>                                                </li>                                                <!--</volist>-->                                            </ul>                                        </div>                                    </div>

/*好友列表样式*/.friend-list {    text-align: left;    font-size: 12px;    color: black;}.friend-list .title {    padding: 15px;    background-color: #E6EAF2;    font-size: 15px;}.friend-list .title #i-icon {    margin-right: 10px;}.friend-list .title:hover {    cursor: pointer;    background-color: #D4EAF2;}.friend-list .max-he {    height: 400px;    overflow-y: auto;}.friend-list .fri-group {    padding: 0;}.friend-list .fri-group a {    display: block;    width: 100%;    line-height: 39px;    color: black;    padding-left: 15px;}.friend-list .fri-group > a:hover,.friend-list .fri-group > a:focus {    background-color: #E1F4FF;    text-decoration: none;}.friend-list .fri-group .group-fri {    padding-left: 0;}.friend-list .fri-group .group-fri li a p.conceal {    margin-top: 0;    margin-bottom: 0;    white-space:nowrap;    overflow:hidden;    text-overflow:ellipsis;}.friend-list .fri-group .group-fri li a p img {    margin-right: 12px;}.friend-list .fri-group .group-fri li:hover {    background-color: #F4B877;}

$(document).ready(function() {                $(‘.inactive‘).click(function(){                    if($(this).siblings(‘ul‘).css(‘display‘)==‘none‘){                        $(this).parent(‘li‘).siblings(‘li‘).removeClass(‘inactives‘);                        $(this).addClass(‘inactives‘);                        $(this).siblings(‘ul‘).slideDown(200).children(‘li‘);                        if($(this).parents(‘li‘).siblings(‘li‘).children(‘ul‘).css(‘display‘)==‘block‘){                            $(this).parents(‘li‘).siblings(‘li‘).children(‘ul‘).parent(‘li‘).children(‘a‘).removeClass(‘inactives‘);                            $(this).parents(‘li‘).siblings(‘li‘).children(‘ul‘).slideUp(200);                        }                    }else{                        //控制自身变成+号                        $(this).removeClass(‘inactives‘);                        //控制自身菜单下子菜单隐藏                        $(this).siblings(‘ul‘).slideUp(200);                        //控制自身子菜单变成+号                        $(this).siblings(‘ul‘).children(‘li‘).children(‘ul‘).parent(‘li‘).children(‘a‘).addClass(‘inactives‘);                        //控制自身菜单下子菜单隐藏                        $(this).siblings(‘ul‘).children(‘li‘).children(‘ul‘).slideUp(200);                        //控制同级菜单只保持一个是展开的（-号显示）                        $(this).siblings(‘ul‘).children(‘li‘).children(‘a‘).removeClass(‘inactives‘);                    }                });            });window.onload = function() {                var str = "";                document.getElementById(‘setvalue‘).onclick = function() {                    str = document.getElementById(‘sign-name‘).value;                    str += document.getElementById(‘setvalue‘).innerHTML + ",";                    document.getElementById(‘sign-name‘).value =http://www.mamicode.com/ str;                }            }            $(‘#fri-title‘).click(function(){                $("#friend").slideToggle(500);                if($(‘#i-icon‘).is(‘.fa-angle-down‘)){                    $(‘#i-icon‘).removeClass(‘fa-angle-down‘);                    $(‘#i-icon‘).addClass(‘fa-angle-up‘);                  }else{                      $(‘#i-icon‘).removeClass(‘fa-angle-up‘);                    $(‘#i-icon‘).addClass(‘fa-angle-down‘);                  }            });            $("input:radio[name=‘sendMode‘]").click(function(){                var val = $("input:radio[name=‘sendMode‘]:checked").val();                switch(val)                    {                    case ‘1‘:                        $(‘.email-div‘).slideToggle(500);                        $(‘.sms-div‘).fadeOut(‘.1s‘);                        $(‘.wechat-div‘).fadeOut(‘.1s‘);                      break;                    case ‘2‘:                        $(‘.sms-div‘).slideToggle(500);                        $(‘.email-div‘).fadeOut(‘.1s‘);                        $(‘.wechat-div‘).fadeOut(‘.1s‘);                      break;                      case ‘3‘:                        $(‘.wechat-div‘).slideToggle(500);                        $(‘.email-div‘).fadeOut(‘.1s‘);                        $(‘.sms-div‘).fadeOut(‘.1s‘);                      break;                    }            });