Question

<div class="show_hide panel-header" rel="#panel">
    <h4>Disclaimer</h4>
</div>
<div id="panel" class="panel">
    <p>Lorem ipsum</p>
</div>

以上是 HTML ... 标题（事件处理程序）的简单div和隐藏 {{ 1}}显示/隐藏。完美适用于简单的显示/隐藏，但我可能同时在屏幕上有几个面板，我不想明确地识别每个面板并赋予它自己的功能。如何使用div选择器实现动态交互？

我的 JQuery 目前：

this

感谢任何帮助。我是JS / JQuery的新手，在理解不同的选择器方面遇到了一些麻烦。谢谢！

Answer 1

您的div不是孩子，它是行中的next div：

$(this).next("div.panel").slideToggle();

Answer 2

你可以试试这个

<script type="text/javascript">
    $(document).ready(function(){
        $(".panel").hide();
        $('.show_hide').click(function(){
            $(this).next(".panel").slideToggle();
        });           
    });
</script>

Jquery - 使用“this”动态显示和隐藏

2 个答案: