表单按钮禁用无法提交

Question

我想在发送提交请求后禁用我的按钮。我尝试了下面的示例，但它没有按预期工作。

为什么这段代码没有按预期工作？

$(document).ready(function() {
  $('#userSignUp').submit(function() {
    $("input[type='submit']", this).val("Please Wait...").attr('disabled', 'disabled');
    return true;
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="/sign-up" method="post" id="userSignUp">
  ...
  <button type="submit" class="login-sign-up-button">Submit</button>
</form>

Answer 1

您的目标是 input，而不是您正在使用的目标 button。

$("button[type=submit]").val("Please Wait...").attr('disabled', 'disabled');

Answer 2

这个可以吗？

  $(document).ready(function () {

        $("#userSignUp").submit(function (e) {

            //stop submitting the form to see the disabled button effect
            e.preventDefault();

            //disable the submit button
            $("#userSignUp").attr("disabled", true);

            return true;

        });
    });

表单按钮禁用无法提交

Form Button Disable Not Working On Submit

jquery

form-submit