连续自举手风琴条目越来越大？

我正在使用Bootstrap在手风琴（可扩展列表）中显示来自SQL服务器的人员列表。连续自举手风琴条目越来越大？

我的问题是，手风琴中的连续条目之间的空白数量不断增加，这是我无法摆脱的。

它最容易看到它在行动：http://ec2-54-200-151-237.us-west-2.compute.amazonaws.com/#

当空格点击上方开放的标签，这是一些线索，以什么错误 - 但我很新的HTML和JavaScript。

下面是创建新面板的JavaScript：

function create_panel(first_name, last_name, idx){ 
    var $template = $(".template"); 
    var $newPanel = $template.clone(); 
    $newPanel.find(".collapse").removeClass("in"); 
    $newPanel.find(".accordion-toggle").attr("href", "#" + String(idx)) 
      .text(last_name+" "+first_name); 
    $newPanel.find(".panel-collapse").attr("id", idx).addClass("collapse").removeClass("in"); 
    return $newPanel; 
}

而html面板组元素：

<div class="panel-group" id="accordion1"> 
    <div class="panel panel-default template" style="display:none"> 
    <div class="panel-heading accordion-toggle" data-toggle="collapse" data-parent="#accordion1" href="#collapse20" style="width:100%;"> 
     <a class="panel-title"> 
     Mr. Template <span class="label label-danger" style="float:right">Urgent</span> 
     </a> 
    </div> 
    <div id="collapse20" class="panel-collapse collapse"> 
     <div class="panel-body"> 
     <div class="btn-group"> 
      <button type="button" class="btn"><i class="glyphicon glyphicon-flag"></i></button> 
      <button type="button" class="btn"><i class="glyphicon glyphicon-earphone"></i></button> 
      <button type="button" class="btn"><i class="glyphicon glyphicon-ok"></i></button> 
     </div> 
     </div> 
    </div> 
    </div> 
</div>

如果有人可以帮我看看问题出在哪里，我会非常感谢。

在此先感谢

来源

2016-01-20 Boyentenbi

我在发布后立即解决了此问题。

，额外的空格是复利的事实放倒我送行：

的JavaScript指的是每次做一个新条目时间的最后创建的项目.template - 因此复利。我向面板元素添加了id=template，并将javascript引用更改为#template，手风琴现在看起来很正常。

来源

2016-01-20 14:49:05 Boyentenbi

刚刚发布说有重复正在进行！很高兴你想出来了。 –

连续自举手风琴条目越来越大？

回答

相关问题