【问题标题】:Bootstrap collapse is not working with the each loop of Meteor.jsBootstrap 崩溃不适用于 Meteor.js 的每个循环
【发布时间】:2025-12-27 07:55:11
【问题描述】:

我正在检索以下模板中的位置列表

<template name="explore">
    <h2>Explore Places</h2>
    <ul>
        {{#each locations}}
        <h4><a data-toggle="collapse" data-target="#info">{{name}}</a></h4>
        <p id="info" class="collapse">{{{information}}}</p>
        {{/each}}
    </ul>
 </template>

每当点击一个位置时,我想通过使用引导折叠来显示其相应的隐藏信息。但是单击列表中的任何链接总是会显示列表中第一项的信息。

【问题讨论】:

  • 乍一看,你不是也需要&lt;li&gt;吗?
  • 已添加。没什么区别。

标签: javascript twitter-bootstrap meteor


【解决方案1】:

解决了,我为每个可折叠标签使用了相同的“id”:

<template name="explore">
    <h2>Explore Places</h2>
    <ul>
        {{#each locations}}
        <h4><button class="btn btn-mini" data-toggle="collapse" data-target="#{{name}}">{{name}}</button></h4>
        <li>
            <p id="{{name}}" class="collapse">{{{information}}}</p>
        </li>
        {{/each}}
    </ul>
</template>

【讨论】: