ruby-on-rails - Twitter Bootstrap 模态：输入是不可见的

Question

这段代码有什么问题？没有输入显示，但模态页脚中的按钮会显示。知道这里发生了什么吗？

<div class="modal" style="display: none;" id="customArticleModal">
  <div class="modal-header">
    <h3>Add your own article</h3>
  </div>
  <%= form_for(@custom_article) do |f| %>
    <div class="modal-body">
      <%= f.text_field :name %>
      <%= f.text_field :description %>
    </div>
    <div class="modal-footer">
      <%= f.submit "Create", :class => 'btn btn-primary' %>
    </div>
  <% end %>
</div>

编辑

这是渲染的源代码：

<div class="modal hide fade" id="customArticleModal">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
    <h3>Add your own article</h3>
  </div>
  <form accept-charset="UTF-8" action="/components" class="new_component" enctype="multipart/form-data" id="new_component" method="post">
    <div class="modal-body">
      <input id="component_name" name="component[name]" size="30" type="text" />
      <input id="component_description" name="component[description]" size="30" type="text" />
    </div>
    <div class="modal-footer">
      <input class="btn btn-primary" name="commit" type="submit" value="Create article" />
    </div>  
  </form>
</div>

Answer 1

<div class="modal" style="display: none;" id="customArticleModal">

在这里，您手动将样式添加为 display: none。而不是尝试使用引导类。例如

<div class="modal hide fade" id="customArticleModal">

Answer 2

我写了一点 jQuery 来覆盖 Bootstrap 在这里所做的一切。

$(document).ready(function() {
  $('#custom_article_form .control-group .controls input').css('display', 'block');
  $('#custom_article_form .control-group .controls textarea').css('display', 'block');
});

不知道为什么会这样。