javascript - 使用 Jquery 显示/隐藏两个 Div

Question

我有两个 div:

         <a href="#" class="component_expand"></a>
        <div class="component_wrapper">

        </div>

         <a href="#" class="component_expand"></a>
        <div class="component_wrapper">

        </div>

Jquery 代码:

<script type="text/javascript">

    $(document).ready(function(){

    $(".component_wrapper").hide();
    $(".component_expand").show();

    $('.component_expand').click(function(){
    $(".component_wrapper").slideToggle();
    });

  });

  </script>

每次单击“组件展开”时，我都会尝试打开一个 DIV。现在开两个我很高兴他们能帮助我

Answer 1

您需要使选择器具体化，请使用 next .

$(this).next().slideToggle();

尝试:

 $(document).ready(function(){
    $(".component_wrapper").hide(); //You can do this using css rule itself
    $(".component_expand").show().click(function(){
        $(this).next().slideToggle();
    });
  });

<强> Demo