javascript - 如何用javascript隐藏Bootstrap模式？(How to hide Bootstrap modal with javascript?)

Question

I've read the posts here, the Bootstrap site, and Googled like mad - but can't find what I'm sure is an easy answer...(我已经阅读了这里的帖子，Bootstrap网站，以及Googled就像疯了一样 - 但找不到我确定的简单答案......)

I have a Bootstrap modal that I open from a link_to helper like this:(我有一个Bootstrap模式，我从link_to帮助器打开，如下所示：) <%= link_to "New Contact", new_contact_path, {remote: true, 'data-toggle' => 'modal', 'data-target' => "#myModal", class: "btn btn-primary"} %> In my ContactsController.create action, I have code that creates Contact then passes off to create.js.erb .(在我的ContactsController.create操作中，我有代码创建Contact然后传递给create.js.erb 。) In create.js.erb , I have some error handling code (a mix of ruby and javascript).(在create.js.erb ，我有一些错误处理代码（ruby和javascript的混合）。) If everything goes well, I want to close the modal.(如果一切顺利，我想关闭模态。) This is where I'm having trouble.(这是我遇到麻烦的地方。) I can't seem to dismiss the modal when all goes well.(当一切顺利时，我似乎无法解雇模态。) I've tried $('#myModal').modal('hide');(我试过$('#myModal').modal('hide');) and this has no effect.(这没有效果。) I've also tried $('#myModal').hide();(我也试过$('#myModal').hide();) which causes the modal to dismiss but leaves the backdrop.(这导致模态消除但离开背景。) Any guidance on how to close the modal and/or dismiss the backdrop from within create.js.erb ?(关于如何从create.js.erb关闭模态和/或关闭背景的任何指导？) Edit(编辑) Here's the markup for myModal:(这是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>   ask by jvillian translate from so

Answer 1

With the modal open in the browser window, use the browser's console to try(在浏览器窗口中打开模式后，使用浏览器的控制台进行尝试)

$('#myModal').modal('hide'); If it works (and the modal closes) then you know that your close Javascript is not being sent from the server to the browser correctly.(如果它工作（并且模式关闭），那么您知道您的关闭Javascript 没有正确地从服务器发送到浏览器。) If it doesn't work then you need to investigate further on the client what is happening.(如果它不起作用，那么你需要进一步调查客户端发生了什么。) Eg make sure that there aren't two elements with the same id.(例如，确保没有两个具有相同ID的元素。) Eg does it work the first time after page load but not the second time?(例如，它是在页面加载后第一次工作但不是第二次吗？) Browser's console: firebug for firefox, the debugging console for Chrome or Safari, etc.(浏览器的控制台：firefox的firebug，Chrome或Safari的调试控制台等。)