关于下拉列表内容的展示与隐藏

html代码

  <li class="itm" id="news">
        <a  class="itm-a"  onclick="btnOpen()">新闻资讯</a>
        <ul class="son">
            <li class="son-itm"><a href="http://phply.blog.163.com/blog/#" class="son-itm-a">网站栏目</a></li>
            <li class="son-itm"><a href="http://phply.blog.163.com/blog/#" class="son-itm-a">网站栏目</a></li>
            <li class="son-itm"><a href="http://phply.blog.163.com/blog/#" class="son-itm-a">网站栏目</a></li>
            <li class="son-itm"><a href="http://phply.blog.163.com/blog/#" class="son-itm-a">网站栏目</a></li>
        </ul>
    </li>

js代码

function btnOpen(){
var ulStatus = $('#news').children('ul');
console.log(ulStatus)
if(ulStatus.is(':hidden')){
ulStatus.slideDown();
}else{
ulStatus.slideUp();
}
}

css代码

.son{
display:hidden;
}

关注我的公众号SpaceObj 领取idea系列激活码