2016-09-28 49 views
0

我想创建单独的元素切换显示/隐藏。 所有相似的元素都对此操作做出响应。我如何只为一个特定的设置做这项工作?所有类似的部分越来越切换当前使用jQuery定位单套重复元素

下面有什么,我已经创建

https://jsfiddle.net/bqu0hznf/

<div class="container-fluid"> 
<div class="row"> 
    <div class="col-md-12"> 
     <div class="panel panel-primary panel-custom"> 
      <div class="panel-heading"> 
       <div class="img-wrap"> 
        <img src="http://placehold.it/50x50"> 
       </div> 
       <div class="content-wrap"> 
        <h4 class="panel-title"><a href="javascript:void(0);" class="acc-toggle">Basic panel example</a></h4> 
        <p>Lorem ipsum dolor blah blah blah....</p> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

<div class="row"> 
    <div class="col-md-12"> 
     <div class="panel panel-primary panel-custom"> 
      <div class="panel-heading"> 
       <div class="img-wrap"> 
        <img src="http://placehold.it/50x50"> 
       </div> 
       <div class="content-wrap"> 
        <h4 class="panel-title"><a href="javascript:void(0);" class="acc-toggle">Basic panel example</a></h4> 
        <p>Lorem ipsum dolor blah blah blah....</p> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

<div class="row"> 
    <div class="col-md-12"> 
     <div class="panel panel-primary panel-custom"> 
      <div class="panel-heading"> 
       <div class="img-wrap"> 
        <img src="http://placehold.it/50x50"> 
       </div> 
       <div class="content-wrap"> 
        <h4 class="panel-title"><a href="javascript:void(0);" class="acc-toggle">Basic panel example</a></h4> 
        <p>Lorem ipsum dolor blah blah blah....</p> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

<script> 
    $('.acc-toggle').click(function() { 
     $('.panel-custom p , .panel-custom .img-wrap img').fadeToggle('fast', 'linear'); 
    }); 
</script> 

回答

2

使用$(this).closest('.panel-custom')找到祖先小提琴.panel-custom,然后找到p, .img-wrap img内它如下。

$('.acc-toggle').click(function() { 
    $(this).closest('.panel-custom').find('p, .img-wrap img').fadeToggle('fast', 'linear'); 
}); 

UPDATED FIDDLE