如何让两个slidetoggle使用JQuery

Question

基本上我想得到一段代码，只要点击它们就可以切换多段代码，现在我是JQuery的新手，我似乎无法让它工作。任何帮助都会很棒< / p>

<script> 
$(document).ready(function () {
    $("#flip").click(function () {
        $("#panel").slideToggle("1000");
    });
});
</script>

上面是脚本，下面是我想让它生效的代码。

        <div class = "description">

        <div id="flip">

                dog says how do ?
                <div id="panel">hidden text</div>   
        </div>

                <div id="flip">

                dog says how do ?
                <div id="panel">more hidden text</div>

        </div>

第一个“面板”将起作用，但第二个面板处于休眠状态。

Answer 1

id应该是唯一的，您需要使用类来代替：

<div class="flip">
    dog says how do ?
    <div class="panel">hidden text</div>   
</div>

然后你可以这样做：

$(".flip").click(function(){
    $(this).find(".panel").slideToggle("1000");
});