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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5768248/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 18:17:01  来源:igfitidea点击:

Jquery: slideToggle() multiple divs independently using one function

javascriptjquery

提问by starsinmypockets

Markup:

标记:

<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>

and the JQuery:

和 JQuery:

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

I'd like to be able to toggle these <ul>s independently. Currently, when either <h3>title is clicked both divs toggle...

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

code is at: http://jsfiddle.net/CPvCZ/4/

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

回答by methodofaction

The solution is quite simple:

解决方法很简单:

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

http://jsfiddle.net/CkTRa/

http://jsfiddle.net/CkTRa/