javascript - 提交输入不会触发任何内容

Question

我有一些 Rails 应用程序，但我的提交按钮没有触发任何内容。 (我正在使用 twitter bootstrap)。这是标签

<input class="btn btn-info" type="submit" value="Sign up" name="commit">

当我点击它时，没有任何反应。也许 bootstrap 中有一些“阻止默认”方法，但我该如何调试它？

<form accept-charset="UTF-8" action="/users" class="panel-body" data-validate="true" id="new_user" method="post" novalidate="novalidate"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="TOWfy1DjcfzzIoCe/BYdEfsKf5gyW902uiyAZxq2GVw="></div>
           <div class="block">
               <label class="control-label" for="user_user_name">User name</label>
               <input class="form-control" id="user_user_name" name="user[user_name]" placeholder="username" type="text" data-validate="true">
           </div>

</a>           <input class="btn btn-info" type="submit" value="Sign up" name="commit">
           <div class="line line-dashed"></div>
           <div class="row">
             <div class="col-sm-6 text-center">
               <a href="#" class="btn btn-facebook btn-circle btn-sm"><i class="icon-facebook"></i>Sign up with Facebook</a>
             </div>
                     <div class="col-sm-6 text-center">
            <a class="btn btn-twitter btn-circle btn-sm" href="/users/auth/twitter">
            <i class="icon-twitter"></i>Sign up with Twitter
</a>        </div>

           </div>
           <div class="line line-dashed"></div>
</form>

我的rails代码(上面的代码本质上是以下代码的产物，我删除了不必要的输入):

<%= form_for(resource, :as => resource_name, :validate => true, :html => {:class => "panel-body"}, :url => registration_path(resource_name)) do |f| %>
           <%= devise_error_messages! %>
           <div class="block">
               <%= f.label :user_name, :class=>"control-label"%>
               <%= f.text_field :user_name, :autofocus => true, :placeholder=>"username", :class=>"form-control" %>
           </div>
           <div class="block">
             <%= f.label :email, :class=>"control-label"%>
             <%= f.email_field :email, :autofocus => true, :placeholder=>"email", :class=>"form-control" %>
           </div>
           <div class="block">
             <%= f.label :password, :class=>"control-label"%>
             <%= f.password_field :password, :autofocus => true, :placeholder=>"password", :id=>"inputPassword", :class=>"form-control" %>
           </div>
           <div class="block">
             <%= f.label :password_confirmation, :class=>"control-label"%>
             <%= f.password_field :password_confirmation, :autofocus => true, :placeholder=>"confirm password", :id=>"inputPassword", :class=>"form-control" %>
           </div>
           <div class="checkbox">
             <label>
               <%= f.check_box :terms_of_service, {}, true, false %> Agree the <%= link_to "terms and policy" %>
             </label>
           </div>
           <%= link_to dees_path, :class=>"pull-right m-t-mini" do%>
             Forgot password? <%= content_tag(:small, "", :class => "") %>
           <% end %>
           <%= f.submit "Sign up", class:"btn btn-info" %>
           <div class="line line-dashed"></div>
           <div class="row">
             <div class="col-sm-6 text-center">
               <a href="#" class="btn btn-facebook btn-circle btn-sm"><i class="icon-facebook"></i>Sign up with Facebook</a>
             </div>
             <%= render "devise/shared/connect_social_links" %>
           </div>
           <div class="line line-dashed"></div>
        <% end %>

Answer 1

第一步是确保您的应用程序确实收到“提交”调用。如果不是，那么就是您的 HTML 表单有问题，如果是，那么就是您使用 Rails 定义表单的方式有问题

这就是我要做的:

#app/assets/javascripts/application.js
$(document).on('submit', '.panel-body', function(e) {
    e.preventDefault();
    alert('submit');
});

这可以让您查看提交函数是否实际触发。之后，您将能够判断是否是表单数据本身导致了问题。

据我所知，您正在使用 Devise，您可能没有正确定义 form_for 变量。如果您尝试我发布的建议，然后在评论中回复其效果，我将更有能力帮助您