1

我有一个 Rails 应用程序，它在模式视图中为访问者提供一个表单。单击提交按钮时，我希望表单提交并且模式视图消失而不重新加载其后面的页面。我已经尝试将模态视图的解除绑定到 javascript 中表单的提交函数，但它无法正常工作。我是 javascript 新手，所以我可能没有正确编写脚本。这是我所拥有的：

<script type="text/javascript">
    $("document").on("submit", ".new_user", function() {
        $('.signup').modal("close");
    });
</script>
<fieldset>

      <!-- The sign up modal view -->
       <div id="signup" class="modal hide fade in" style="display: none;">  
        <% @user = User.new %>
        <%= form_for(@user, :remote => true) do |f| %>
        <div class="modal-header">  
          <a class="close" data-dismiss="modal">×</a>  
          <h3>Want to be notified when preorders start? Fill out this form!</h3>  
        </div>  
        <div class="modal-body">  
            <div class="field">
              <%= f.label :email %>
              <%= f.text_field :email, :class => 'modal_input'%>
            </div>
            <div class="field">
              <%= f.label :website %>
              <%= f.text_field :website, :class => 'modal_input'%>
            </div>
            <div class="field">
              <%= f.label :projects, "Projects you've worked on"  %>
              <%= f.text_area :projects, :size => "43x10", :class => 'modal_input' %>
            </div>
        </div>
        <div class="modal-footer">  
        <button type="submit" class="btn btn-success">Submit</button>
        </div>  
       </div>  
      <% end %>


       <!-- The modal view is triggered here -->
        <a data-toggle="modal" href="#signup" class="btn btn-primary
        btn-large btn-signup">Sign up</a>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>  
        <script src="/twitter-bootstrap/twitter-bootstrap-v2/js/bootstrap-modal.js"></script>
  </fieldset>

我的 javascript 函数没有关闭模式视图。功能有什么问题？

编辑：更新了 javascript 函数，仍然无法正常工作

编辑 2：如果有帮助的话，结果是根本没有调用 javascript 函数。

4

1 回答 1

2

close()不是 jQuery 方法，也不是 Bootstrap 模态库的工作方式。此外，应该将提交绑定更改为绑定，以便在设置绑定后将内容插入 DOM。

您可能应该将您的功能更改为以下内容：

$(function () {
  $("document").on("submit", ".new_user", function() {
      $('.signup').modal("close");
  });
});

此外，请确保您已在此函数之前加载了 jQuery 和 Bootstrap 模态脚本文件。

于 2012-12-30T00:50:47.833 回答