求教jquery的问题

我想用jquery做树形菜单
点击AA时A-1显示或隐藏，点击BB时B-1和B-2显示或隐藏
以下是我写的代码，但达不到这个效果，求教<div id="menu">
<h2 id="p">AA</h2>
<ul id="c">
<li>A-1</li>
</ul>
<h2 id="p">BB</h2>
<ul id="c">
<li>B-1</li>
<li>B-2</li>
</ul>
</div>$("h2").live("click", function(event){
    $("ul").toggle(500);
});

解决方案 »

  1.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
        <script>
            $("h2").live("click", function (event) {
                $(this).next("ul").toggle(500);
            });
    </script>
    </head>
    <body>
        <div id="menu">
            <h2 id="p">
                AA</h2>
            <ul id="c">
                <li>A-1</li>
            </ul>
            <h2 id="p">
                BB</h2>
            <ul id="c">
                <li>B-1</li>
                <li>B-2</li>
            </ul>
        </div>
    </body>
    </html>提醒一下。。id不要重复。。自己改改吧
      

  2.   

    不用ID 可以吗？就显示或隐藏单击的h2下的ul
      

  3.   

    我是想这样实现的
    each循环遍历所有的h2，判断是不是当前单击的h2，如果是就显示或隐藏其下的ul
    但是代码不会写，-_-;;
      

  4.   

    我上面的方法就是 你的原型啊。。$(this).next("ul").toggle(500);
    改成这样就行了
      

  5.   

    根据id，写这个函数
    function ChangeDiv(divId,divName,zDivCount)//隐藏函数{ for(i=0;i<=zDivCount;i++) {     document.getElementById(divName+i).style.display="none"; } document.getElementById(divName+divId).style.display="block";}