2016-09-13 105 views
0

我正在使用slideToggle()展開面板中的元素。點擊後,該功能不會擴展所述元素。slideToggle不擴展元素

下面的代碼:

HTML

<div class="panel panel-default"> 
    <div class="panel-heading"> 
     <h6 class="panel-title" style="text-align: center;"><a href='#' class="accordion-toggle">Risks</a></h6> 
    </div> 
    <div class="accordion-content" id="risks" style="height: 0;overflow: hidden;"> 
     <div class="panel-body" style="text-align: center; font-size: 18px;">5.8%</div> 
    </div> 
    </div> 

的Javascript

(document).ready(function($) { 
    $('.accordion').find('.accordion-toggle').click(function(){ 

    //Expand or collapse this panel 
    $(this).next().slideToggle('fast'); 

    //Hide the other panels 
    $(".accordion-content").not($(this).next()).slideUp('fast'); 

    }); 
}); 

回答

1

我做什麼,去兩層起來,然後尋找在請求的元素父 - 母元素的兄弟姐妹。

$(document).ready(function(){ 
    $(".accordion-toggle").click(function(){ 
     $(".accordion-toggle").not(this).parent().parent().siblings(".accordion-content").slideUp(); 
     $(this).parent().parent().siblings(".accordion-content").slideToggle("fast"); 
    }); 
    }); 

我做了一個搗鼓你在這裏:https://jsfiddle.net/aLedkzw6/1/

作出的編輯。幹得好。

+0

一切都按預期工作!我懷疑這方面的原因是什麼,但是在對代碼進行概念化時遇到了一些麻煩。謝謝您的幫助。 – jakeinbake