<div class="list_tilte_onclick"><span>主菜单</span></div>
            <div class="list_detail">
                <ul>
                    <li><a href="#">子菜单</a></li>
                </ul>
            </div><script type="text/javascript">
        $(function () {
            $(".list_detail").css("display", "none")
            $(".list_tilte_onclick").click(function () {
                $(this).next(".list_detail").css("display","block")
            });
        })
    </script>
我想在点击主菜单的时候把他下面的子菜单层隐藏起来,再次点击的时候收起来

解决方案 »

  1.   

    JQUERY切换
      

  2.   


    <html>
      <head>
      <title>zell419</title>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">    </script>
      <script>
        jQuery(function(){
            $(".list_detail").hide();
            $(".list_tilte_onclick").click( function (){ 
                $(this).next().toggle();
            }); 
        }); 
      </script>  </head>
      <body>
        <div class="list_tilte_onclick"><span>主菜单</span></div>
                <div class="list_detail">
                    <ul>
                        <li><a href="#">子菜单</a></li>
                    </ul>
        </div>
      </body>
    </html>这样吧 ?
      

  3.   

     $(this).toggleClass("youClass");
    这个函数 。你试试 。
      

  4.   


    var myclass =  $(this).attr("class")=="myclass1"?"myclass2":"myclass1";
    $(this).attr("class",myclass); .myclass1{ color:Red;}
     .myclass2{ color:Blue;}
    那这样 。