模态仅显示深色背景

Question

我正在尝试在 RoR 项目中创建引导模式。我使用动词登录，但不使用设计。我只是想弄清楚这种模式而没有添加设计的复杂性！

我似乎在单击登录链接后到达了服务器，但我只看到灰色覆盖！

应用程序.htm.erb

 <div class="container">
  <div class="well">
   <%= link_to 'login', login_url,
   {:remote => true,
    'data-toggle' =>  "modal",
     'data-target' => '#login',
      :class => "btn btn-primary "} %>
     </div>
  </div>
  <div id="login" class="modal hide fade"></div>

_login.html.erb

<div class="modal hide fade in" id="login">
  <div class="modal-header">
    <button class="close" data-dismiss="modal">x</button>
    <h2>Sign in</h2>
  </div>
  <div class="modal-body">
    <h2>Login form will go here</h2>
  </div>
  <div class="modal-footer">modal footer text</div>
</div>

登录.js.erb

$("#login-modal").html("<%= escape_javascript(render 'login') %>")
$("#login-modal").modal("show")

站点#登录

def login
  respond_to do |format|
     format.js
   end
end 

控制台输出

于 2014-07-28 16:38:59 -0700 开始获取 127.0.0.1 的“/login”

由SiteController#login作为JS处理

渲染站点/_login.html.erb (0.0ms)

渲染的 site/login.js.erb (1.0ms)

Answer 1

您的模态标记似乎不正确。看起来您是从旧的 Bootstrap 2 示例中获取的？将其与中的示例进行比较 http://getbootstrap.com/javascript/#modals .

您的代码中的问题包括：

• 你不应该使用 hide 或者 in 类
• 丢失的 modal-dialog 和 modal-content <div>s

您的代码基于什么资源/示例？