表单按钮禁用不工作提交

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

这样做吗？

  $(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;

        });
    });

Answer 2

您定位的是input，而是定位您正在使用的button。

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