如何从JavaScript中隐藏Bootstrap模态?

问题:

我已经阅读这里的帖子,Bootstrap网站,并疯狂谷歌搜索 – 但无法找到我敢肯定是一个简单的答案…
我有一个Bootstrap模式,我从一个link_to这样的助手打开:

<%= link_to "New Contact", new_contact_path, {remote: true, 'data-toggle' => 'modal', 'data-target' => "#myModal",  class: "btn btn-primary"} %>

在我的ContactsController.create操作中,我创建了Contact,然后传递给create.js.erb的代码。在create.js.erb中,我有一些错误处理代码(混合使用ruby和javascript)。如果一切顺利,我想关闭模式。
这是我有麻烦的地方。一切顺利的时候,我似乎无法排除模态。
我试过$('#myModal').modal('hide');,这没有任何作用。我也尝试了$('#myModal').hide();,导致模式被解雇,但离开了背景。
有关如何关闭模式和/或从create.js.erb内退出背景的指导
 编辑
这是myModal的标记:

<div class="modal hide" id="myModal" >
  <div class="modal-header">
    <a class="close" data-dismiss="modal">×</a>
    <h3>Add Contact</h3>
    <div id="errors_notification">
    </div>
  </div>
  <div class="modal-body">
    <%= form_for :contact, url: contacts_path, remote: true do |f| %>  
      <%= f.text_field :first_name, placeholder: "first name" %>
      <%= f.text_field :last_name, placeholder: "last name" %>
      <br>
      <%= f.submit "Save", name: 'save', class: "btn btn-primary" %>
      <a class="close btn" data-dismiss="modal">Cancel</a>
    <% end %>
  </div>
  <div class="modal-footer">
  </div>
</div>

回答:

在浏览器窗口中打开模式,使用浏览器的控制台尝试

$('#myModal').modal('hide');

如果它工作(和模式关闭),那么你知道你的关闭Javascript是not正确地从服务器发送到浏览器。
如果它不起作用,那么你需要进一步调查客户端发生了什么事情。例如,确保没有两个具有相同ID的元素。例如,页面加载后第一次运行,但不是第二次?
浏览器的控制台:Firefox的firebug,Chrome或Safari的调试控制台等

 
 
Code问答: http://codewenda.com/topics/javascript/
Stackoverflow: How to hide Bootstrap modal from javascript?

*转载请注明本文链接以及stackoverflow的英文链接

发表评论

电子邮件地址不会被公开。 必填项已用*标注

11 − 1 =