slideToggle 不展开元素
slideToggle not expanding element
我正在使用 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');
});
});
我所做的是向上两层,然后在父元素的兄弟元素中查找请求的元素。
$(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");
});
});
我在这里为你做了一个fiddle:https://jsfiddle.net/aLedkzw6/1/
进行了编辑。给你。
我正在使用 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');
});
});
我所做的是向上两层,然后在父元素的兄弟元素中查找请求的元素。
$(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");
});
});
我在这里为你做了一个fiddle:https://jsfiddle.net/aLedkzw6/1/
进行了编辑。给你。