Question

我有一个包含textarea和提交按钮的表单。当用户单击提交按钮时，表单将使用AJAX以acyshornized方式提交。我想在提交期间禁用textarea和按钮。

我尝试将JS click事件绑定到submit按钮并在那里禁用这两个控件。我的代码在这里：

形式：

<%= form_for @tweet, remote: true do |f| %>
  <%= hidden_field_tag :authenticity_token, form_authenticity_token %>
    <% if @tweet.errors.any? %>
        <div id="error_explanation">
            <h2><%=pluralize(@tweet.errors.count, "error") %> prohibited this article form being saved:</h2>
            <ul>
                <% @tweet.errors.full_messages.each do |msg| %>
                    <li><%= msg %></li>
                <% end %>
            </ul>
        </div>
    <% end %>

    <div class="div_add_text">
        <%= f.text_area :content, id: "textarea_add_tweet" %>
        <%= f.submit class: "pure-button", id: "btn_add_tweet" %>
    </div>

    <div class="div_submit">
    </div>
<% end %>

JS

$(document).ready( function () {
    $("#btn_add_tweet").click(function() {
        $(this).prop("disabled",true);
        $("#textarea_add_tweet").prop("disabled",true);
    });
});

但是，如果我这样做，表格将不会被提交。我怎样才能达到我想要的效果？

Answer 1

您是否尝试过设置超时？在执行按钮的关联操作之前调用OnClick，因此异步禁用应该有效。

$(document).ready( function () {
  $("#btn_add_tweet").click(function() {
    setTimeout(function() {
      $("#btn_add_tweet").prop("disabled",true);
      $("#textarea_add_tweet").prop("disabled",true);
    }, 5);
  };
};

其中5是调用函数之前的时间（以毫秒为单位）。

Answer 2

我建议你使用它：

$(window).submit(function() { $('#btn_add_tweet, #textarea_add_tweet').attr('disabled', true); });

因为如果您添加了某种验证，而某些验证失败了，那么它将禁用这两件事。

在Rails中，如何在单击提交按钮后同时禁用textarea并提交按钮？

2 个答案: