关于jquery 选择器的问题

我做了一个导航下拉列表，如图：
![](https://img-ask.csdn.net/upload/201611/22/1479791755_723568.png)
但是现在有个问题 就是我用选择器控制他显示和隐藏的时候有个问题代码 如下：

 <script type="text/javascript">

 $(function(){
  $(".leftnav h2").click(function(){
  alert("asdsad");

      $(this).next().slideToggle(200);  
      $(this).toggleClass("on"); 
  })
  $(".leftnav ul li a").click(function(){
        $("#a_leader_txt").text($(this).text());
        $(".leftnav ul li a").removeClass("on");
        $(this).addClass("on");
  })
});
</script>

以下是页面的布局但是这个事件根本就没有进方法

 <div class="leftnav"> <div class="leftnav-title"><strong><span class="icon-list"></span>菜单列表</strong></div>  <h2><span class="icon-user"></span>产品管理</h2> <ul style="display:block"> <li><a href="info.html" target="right"><span class="icon-caret-right"></span>产品修改</a></li><li><a href="cate.html" target="right"><span class="icon-caret-right"></span>产品删除</a></li><li><a href="cate.html" target="right"><span class="icon-caret-right"></span>产品添加</a></li></ul><h2><span class="icon-pencil-square-o"></span>公司信息管理</h2><ul> <li><a href="info.html" target="right"><span class="icon-caret-right"></span>公司介绍</a></li></ul><h2><span class="icon-pencil-square-o"></span>角色管理</h2><ul> <li><a href="info.html" target="right"><span class="icon-caret-right"></span>角色删除</a></li></ul></div>

能把CSS也发出来吗，这样我可以帮你查看一下问题所在

图片说明

<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <title></title>
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
</head>

<body>
    <div class="leftnav">
        <div class="leftnav-title"><strong><span class="icon-list"></span>菜单列表</strong></div>
        <h2><span class="icon-user"></span>产品管理</h2>
        <ul style="display:block">
            <li>
                <a href="info.html" target="right"><span class="icon-caret-right"></span>产品修改</a>
            </li>
            <li>
                <a href="cate.html" target="right"><span class="icon-caret-right"></span>产品删除</a>
            </li>
            <li>
                <a href="cate.html" target="right"><span class="icon-caret-right"></span>产品添加</a>
            </li>
        </ul>
        <h2><span class="icon-pencil-square-o"></span>公司信息管理</h2>
        <ul>
            <li>
                <a href="info.html" target="right"><span class="icon-caret-right"></span>公司介绍</a>
            </li>
        </ul>
        <h2><span class="icon-pencil-square-o"></span>角色管理</h2>
        <ul>
            <li>
                <a href="info.html" target="right"><span class="icon-caret-right"></span>角色删除</a>
            </li>
        </ul>
    </div>
</body>

$(function(){ $(".leftnav h2").click(function(){ alert("asdsad"); $(this).next().slideToggle(200); $(this).toggleClass("on"); }) $(".leftnav ul li a").click(function(){ $("#a_leader_txt").text($(this).text()); $(".leftnav ul li a").removeClass("on"); $(this).addClass("on"); }) });

我这样完全是可以进得去方法的

你jquery没有导入或者路径错误了吧


<div class="leftnav">
    <div class="leftnav-title">
        <strong><span class="icon-list"></span>菜单列表</strong>
    </div>
    <h2><span class="icon-user"></span>产品管理</h2>
    <ul style="display:block">
        <li><a href="info.html" target="right"><span class="icon-caret-right"></span>产品修改</a></li>
        <li><a href="cate.html" target="right"><span class="icon-caret-right"></span>产品删除</a></li>
        <li><a href="cate.html" target="right"><span class="icon-caret-right"></span>产品添加</a></li>
    </ul>
    <h2><span class="icon-pencil-square-o"></span>公司信息管理</h2>
    <ul>
        <li><a href="info.html" target="right"><span class="icon-caret-right"></span>公司介绍</a></li>
    </ul>
    <h2><span class="icon-pencil-square-o"></span>角色管理</h2>
    <ul>
        <li><a href="info.html" target="right"><span class="icon-caret-right"></span>角色删除</a></li>
    </ul>
</div>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">

    $(function () {
        $(".leftnav h2").click(function () {
            alert("asdsad");

            $(this).next().slideToggle(200);
            $(this).toggleClass("on");
        })
        $(".leftnav ul li a").click(function () {
            $("#a_leader_txt").text($(this).text());
            $(".leftnav ul li a").removeClass("on");
            $(this).addClass("on");
        })
    });
</script>