Jquery:slideToggle()使用一个函数独立地多个div

时间:2011-04-24 02:16:38

标签: javascript jquery

标记:

<div>
    <h3 class = "trigger">Heading 1</h3>
    <ul class = "toggle">
        <li>Line One</li>
        <li>Line Two</li>
        <li>Line Three</li>
    </ul>
</div>
<div>
    <h3 class = "trigger">Heading 2</h3>
    <ul class = "toggle">
        <li>Line One</li>
        <li>Line Two</li>
        <li>Line Three</li>
    </ul>
</div>

和JQuery:

$(".toggle").slideUp();
$(".trigger").click(function(){
    $(".toggle").slideToggle("slow");
  });

我希望能够独立切换这些<ul>。目前,当点击任一<h3>标题时,两个div都切换...

代码位于:http://jsfiddle.net/CPvCZ/4/

1 个答案:

答案 0 :(得分:7)

解决方案非常简单:

$(".toggle").slideUp();
$(".trigger").click(function(){
    $(this).next(".toggle").slideToggle("slow");
  });

http://jsfiddle.net/CkTRa/