Jquery 主干，模板内的引导模式未显示

我试图为我的每个帖子生成一个模式，这样每个帖子都有一个包含帖子内容（以及最终评论）的模式。单击注释链接时，将显示模式。问题是我必须为每一篇文章创建一个引导模式块，所以我决定在主干模板中这样做是最简单的。为什么这不起作用

这是我的密码：

app/assets/templates/posts/index.jst.eco js控制台中没有错误，模态似乎没有出现。 每个post都有一个模式块，其html id字段等于“post-（posts id）”

---

非常感谢您的帮助

这听起来与许多关于引导模态和使用主干的SO问题非常相似。从Dereck Bailey处查看此解决方案

//模板
这是一个模态！
里面有一些内容

取消
好啊
//html只有一个模态div
//在你的显示路由器功能
var view=newmyview（）；
view.render（）；
var$modalEl=$（“\35;模态”）；
$modalEl.html（view.el）；
$modalEl.modal（）；

他的解释是,

人们在使用情态动词时遇到的核心问题 对话框中，模态插件将删除包装 模态，来自DOM。它通常被添加到一些特殊的保持中 模态插件可以保证元素不会出现的位置 在打开“模式”对话框之前保持可见。我太笼统了 这有点奇怪，但许多模态对话框都是以这种方式工作的，或者是以某种方式工作的 类似的方式

这通常会导致主干视图丢失 当DOM元素被 模态对话框。当模态对话框从视图中删除视图的

el

时 在DOM中，

事件

配置将丢失，因为DOM元素 已从DOM中移动或删除，jQuery不得不放弃 事件。将

el

重新添加到DOM以将其显示为 因此，

事件

不会重新附加

---

这听起来很像很多关于引导模态和使用主干的问题。从Dereck Bailey处查看此解决方案

//模板
这是一个模态！
里面有一些内容

取消
好啊
//html只有一个模态div
//在你的显示路由器功能
var view=newmyview（）；
view.render（）；
var$modalEl=$（“模态”）；
$modalEl.html（view.el）；
$modalEl.modal（）；

他的解释是,

人们在使用情态动词时遇到的核心问题 对话框中，模态插件将删除包装 模态，来自DOM。它通常被添加到一些特殊的保持中 模态插件可以保证元素不会出现的位置 在打开“模式”对话框之前保持可见。我太笼统了 这有点奇怪，但许多模态对话框都是以这种方式工作的，或者是以某种方式工作的 类似的方式

这通常会导致主干视图丢失 当DOM元素被 模态对话框。当模态对话框从视图中删除视图的

el

时 在DOM中，

事件

配置将丢失，因为DOM元素 已从DOM中移动或删除，jQuery不得不放弃 事件。将

el

重新添加到DOM以将其显示为 因此，

事件

不会重新附加

---

检查它是否应该是

$（“#post-{id}”）

或

$（“#post-{id}”）

？是的，我肯定主干功能正常，但我的引导模式功能不正常。这是一个关于引导模式在主干视图使用的eco模板内运行的问题。检查是否应该是

$（“#post-{id}”）

或

$（“#post-{id}”）

？是的，我确信主干正常运行，但我的引导模式没有正常运行。这是一个面向引导模式的问题，它在主干视图使用的eco模板中运行，可能与

<% for post in @posts.models: %>
<tbody><td>
<%= post.get('content') %>
</td></tbody>
<tr><td>
<a href="#<%= post.get('id') %>">Comment</a>
</td></tr>
<div class="modal" id="post-<%= post.get('id')%>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<%= post.get('content') %>
</div>
</div>
<% end %>

class Voice.Routers.Posts extends Backbone.Router
        routes:
                '': 'index'
                ':id': 'show'
        initialize: ->
                @collection = new Voice.Collections.Posts()
                @collection.fetch()
        index: ->
                view = new Voice.Views.PostsIndex(collection: @collection)
                $('#container').html(view.render().el)
        show: (id) ->
                $("#post-#{id}").modal('show')

// the template
<script id="modal-view-template" type="text/html">
  <div class="modal-header">
    <h2>This is a modal!</h2>
  </div>
  <div class="modal-body">
    <p>With some content in it!</p>
  </div>
  <div class="modal-footer">
    <button class="btn">cancel</button>
    <button class="btn-default">Ok</button>
  </div>
</script>

// the html has only one modal div
<div id="modal"></div>


// inside your show router function
var view = new MyView();
view.render();

var $modalEl = $("#modal");

$modalEl.html(view.el);
$modalEl.modal();