html 禁用提交按钮,直到填写完所有字段

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html 禁用提交按钮,直到填写完所有字段相关的知识,希望对你有一定的参考价值。

http://jsfiddle.net/tKQFN/


<form id="stripe_form">
Username<br />
<input type="text" id="user_input" name="username" /><br />
Password<br />
<input type="text" id="pass_input" name="password" /><br />
Confirm Password<br />
<input type="text" id="v_pass_input" name="v_password" /><br />
Email<br />
<input type="text" id="email" name="email" /><br />     
<input type="submit" id="register" disabled value="Register" />
</form>



<script>
  
$('#user_input, #pass_input, #v_pass_input, #email').bind('keyup', function() {
    if(allFilled()) {
       $('#register').removeAttr('disabled');
    }
    
});

function allFilled() {
    var filled = true;
    $('#stripe_form input').each(function() {
        if($(this).val() == '') {
           $('#register').attr('disabled', true);
        		filled = false;
        }
    });
    return filled;
}  
  
</script>

以上是关于html 禁用提交按钮,直到填写完所有字段的主要内容,如果未能解决你的问题,请参考以下文章

禁用按钮,直到所有表单字段都填写在 Formik

如何禁用提交按钮,直到所有文本字段都已满并选择文件

禁用表单提交按钮,而不阻止 HTML5 验证

当所有字段都被填写后,启用提交按钮

Jquery Blueimp 文件上传回调

如果文本字段被快速填写,则启用按钮