Javascript: deshabilita el botón de envío hasta que los 3 campos no estén vacíos

Tengo este bit que casi funciona: http://jsfiddle.net/HFzkW/ Mi código se ve así:

<form action="" method="POST" >
*

*

*

$(function(){ $("input[type=submit]").attr("disabled", "disabled"); $("#em").blur(function() { var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; var emailaddress = $("#em").val(); if(!emailReg.test(emailaddress) | emailaddress=="") { $("#emailspan").html('Please enter valid Email address'); }else{ $("#emailspan").html(''); } }); $("#yn").blur(function() { var namefield = $("#yn").val(); if(namefield=="") { $("#namespan").html('Please enter your name'); }else{ $("#namespan").html(''); } }); $("#ph").blur(function() { var phonefield = $("#ph").val(); if(phonefield=="") { $("#phonespan").html('Please enter your name'); }else{ $("#phonespan").html(''); } }); $('input, textarea').change(function(){ var validation; var email = $("#em").val(); var name = $("#yn").val(); var phone = $("#ph").val(); if ( email == "" && name == "" && phone == "" ) { validation = false; } else if ( email != "" && name != "" && phone != "" ) { alert ("variables"+email+name+phone); validation = true; } if (validation = true) { $("input[type=submit]").removeAttr("disabled"); } else { $("input[type=submit]").attr("disabled", "disabled"); } }); });

Sin embargo, no puedo hacerlo funcionar completamente. Cuando el usuario ingresa uno de los campos (como su nombre), el botón Enviar ya no está deshabilitado.

Quiero mantener el botón Enviar deshabilitado hasta que se cumplan los 3 campos “requeridos”. Pensé que el código era bastante claro para eso, pero aún no funciona.

Además, funciona aquí en JSFiddle, pero no está funcionando en el sitio de WordPress donde estoy tratando de que funcione. Cualquier idea para comprobar que también sería apreciada.

Intente cambiar de ys a ors. Tenga cuidado con su lógica y trate de decirlo en voz alta para ver si tiene sentido:

El correo electrónico está en blanco y el nombre está en blanco y el teléfono está en blanco; la validación es falsa. Lo que realmente quería era decir si algún campo está en blanco, la validación es falsa.

 if ( email == "" || name == "" || phone == "" ) { validation = false; } else if ( email != "" && name != "" && phone != "" ) { alert ("variables"+email+name+phone); validation = true; } 

Además, está configurando validation=true en su sentencia if. Esto siempre volverá verdadero. Cambie a esto: if (validation == true) {

Por lo que puedo ver, las primeras cosas que haría para depurar esto (el código es un poco confuso, así que en vez de copiarlo, le daré algunas pautas).

en lugar de

  if(validation = true ) 

tratar

  if(validation) 

Esto se debe a que sin ningún parámetro comprobará que no sea falso, indefinido o nulo. Probablemente se puede hacer lo mismo con el nombre del correo electrónico y el teléfono.

Así que básicamente:

 

Y

 function submitButton(formID){ var formObject = document.getElementById(formID); var name = formObject.name.value; var email = formObject.email.value; var phone = formObject.phone.value; if (name && email && phone) { showSubmitButton(); } else { //keep the button hidden } } 
Intereting Posts