javascript - submit() 事件未在表单上触发

Question

我试图在提交表单后禁用表单的提交按钮，以防止重复发布。虽然我可以禁用该按钮，但我也无法让表单实际提交。

这是jQuery：

// Disable submit button after click to prevent double posting
$(document).ready(function () {
    $('#add_pin :submit').on('click', function (e) {

        $(this).prop('disabled', true);    

    });
});

这将成功禁用该按钮，仅此而已。

我试过$(this).submit()在 .prop() 之后添加，但它仍然没有做任何事情。

HTML 只是：

<form action="http://example.com/add" method="post" accept-charset="utf-8" id="add_pin" enctype="multipart/form-data">
// input fields
<input type="submit" name="submit" value="Add Pin" class="radius button">
</form>

我究竟做错了什么？

Answer 1

最好使用表单的onsubmit事件而不是提交按钮的click事件，因为onsubmit它将处理来自输入键的提交以及被单击的提交按钮。

$(document).ready(function () {

    $('#add_pin').submit(function(){
        $(this).find('input[type=submit]').prop('disabled', true);
    });

});