Question

我在选项卡中嵌套了许多动态生成的bootstrap手风琴。这都是引导程序。我有一个手风琴面板默认打开但是一旦我点击它关闭的任何地方，没有其他人会打开。

我正在使用示例中的代码，但填充了dynamica元素。我在这里检查了所有其他可能性 - 确保我的数据目标和/或href与手风琴身体的id相匹配，这一切都很好。有人建议使用数据目标而不仅仅是href，但这没有帮助。每个手风琴都有一个唯一的名称，对数据父母的调用是正确的。这是生成我复制到jsfiddle的源代码：

      <div class="tab-pane active" id="institutional">
       <div class="accordion" id="accordion2">
        {foreach name=loop from=$institutional item=film}
        <div class="accordion-group">
          <div class="accordion-heading">
            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" data-target="#{$film->url_key|escape}" href="#{$film->url_key|escape}">
              {$film->title()|escape} - 
              {$film->title_suffix()|escape}
            </a>
          </div><!-- /accordion-heading -->
          <div id="{$film->url_key|escape}" class="accordion-body collapse {if $smarty.foreach.loop.first} in{/if}">
            <div class="accordion-inner">

http://jsfiddle.net/dylanglockler/7qy8g/1/

---------- UPDATE -------想出来但却无法回答我自己的问题，因为我没有“足够的经验值” - 没有意识到这是一场比赛。

我想出来了...我的手风琴内容的id以及指向它的相关数据目标和href是基于独特的电影标题，但在每个手风琴中重复，尽管在单独的标签上。当然，这是针对非独特的ID。

我的修复如下，我在三个手风琴中的每一个的生成ID之后添加了一个_n（即_1）：

       <div class="accordion" id="accordion1">
        {foreach name=loop from=$home item=film}
        <div class="accordion-group">
          <div class="accordion-heading">
            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1" data-target="#{$film->url_key|escape}_1" href="#{$film->url_key|escape}_1">{$film->title()|escape} - {$film->title_suffix()|escape}</a>
          </div><!-- /accordion-heading -->
          <div id="{$film->url_key|escape}_1" class="accordion-body collapse {if $smarty.foreach.loop.first} in{/if}">

Answer 1

问题似乎是在选项卡内容中有手风琴。

当它从tab-pane移除后，它可以正常工作：http://jsfiddle.net/skelly/7qy8g/2/

Bootstrap手风琴元素无法打开

1 个答案: