显示/隐藏使用jQuery

Question

两个div我有两个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

Answer 2

使用this实例和.next

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