¿Por qué no cambia la propiedad del .error o del color?
Cod.Postal:
<input type="text" name="codigo" id="idcodigo" maxlength="5" onchange="validarCP();" onKeyPress="return soloNumeros(event);">
El CP admitirá un máximo de 5 dígitos. En caso contrario:
- El fondo cambia a color rojo.
- Se mostrará un mensaje.
- Cuando recupere el foco o se introduzca un CP correcto, cambiará el color del fondo.
Código JavaScript
//Solo permite introducir numeros.
function soloNumeros(e){
var key = window.event ? e.which : e.keyCode
return (key >= 48 && key <= 57)
}
function validarCP(){
//Eliminamos la clase error asignada al elemento CP.
document.getElementById("idcodigo").className="";
var valor = document.getElementById("idcodigo").value;
var patron = /^\d{5}$/;
if (patron.test(document.getElementById("idcodigo").value) && (!isNaN(valor))){
document.getElementById("idcodigo").className="correcto";
return true;
}else{
//Situamos el foco en el campo idcodigo y le asignamos la clase error.
alert("El código debe tener al menos 5 digitos.\n");
document.getElementById("idcodigo").focus();
document.getElementById("idcodigo").className="error";
return false;
}
}