Alternativa com JavaScript puro
Formulário HTML:
<form action="" id="form">
<input type="text" placeholder="Digite seu nome">
<input type="text" placeholder="Digite seu sobrenome">
<button type="submit" disabled="disabled">Enviar</button>
</form>
Você pode adicionar quantos campos quiser, apenas coloquei dois para o exemplo.
Agora o código JavaScript necessário:
function checkInputs(inputs) {
var filled = true;
inputs.forEach(function(input) {
if(input.value === "") {
filled = false;
}
});
return filled;
}
var inputs = document.querySelectorAll("input");
var button = document.querySelector("button");
inputs.forEach(function(input) {
input.addEventListener("keyup", function() {
if(checkInputs(inputs)) {
button.disabled = false;
} else {
button.disabled = true;
}
});
});
Primeiramente temos a função checkInput, que vai realizar um loop em cada um dos inputs e verificar se o valor está preenchido
Caso algum deles esteja, a variável filled fica setada como false, fazendo com que o retorno seja falso e isso determina que o formulário não está completamente preenchido
Depois temos um evento em cada um dos inputs, que é ativado com o keyup
Neste evento vamos realizar o disparo da função a cada tecla digitada, para verificar se liberamos o formulário ou não
E se os campos estiverem preenchidos vamos mudar o valor do atributo disabled para false
Caso o usuário volte a remover dados de algum input, ainda fazemos a checagem e se necessário alteramos o input para disabled novamente
disabled
aplicado, senão o usuário pode clicá-lo antes de preencher o form.