javascript - 在 HTML5 验证后禁用所有表单上的提交按钮的通用 jQuery

Question

如果这是一个基础的东西请原谅我，因为我是 Javascript/jQuery 的新手。我一直在尝试禁用提交按钮以禁用多次提交。我在这里也遇到过多种解决方案，但所有这些都使用特定的表单名称。但我想为所有页面上的所有表单应用一个全局解决方案，这样我就不必在每个页面上编写代码，所以我把它放在页脚中，所以所有页面都有:

$('input:submit').click(function(){
        $('input:submit').attr("disabled", true);
});

此代码可按我的意愿在所有页面中的所有表单上运行，但如果表单中有 HTML5 必填字段，并且在没有这些字段的情况下提交表单，当然会弹出通知，但按钮仍会被禁用。所以，我试过这个:

$('input:submit').click(function(){
    if ($(this).valid()) {
        $('input:submit').attr("disabled", true);
        $('.button').hide();
    });
});

但这行不通。请帮助我，以便 jQuery 仅在所有 HTML5 验证完成后才禁用。谢谢

Answer 1

试试这个，让我知道:

$('input:submit').click(function(){
    if ($(this).closest("form").checkValidity()) {
        $('input:submit').attr("disabled", true);
        $('.button').hide();
    });
});