No se porqué no me funciona este codigo... gracias
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Validación de formulario con jQuery-Validate - Unidad 1 - Ej. práctico 1</title>
<script src="jquery-3.4.1.min.js"></script>
<script src="jqueryvalidate/dist/jquery.validate.min.js">
window.onload = function(){
$("#enviar").on("click", validarFormulario)
;
}
// Función para validar que el nombre sólo tenga letras y espacios en blanco.
$(function(){
$.validator.addMethod('latinos', function(value, element){
returnthis.optional(element) || /^[a-zAZÑñáéíóúÁÉÍÓÚ\s]+$/.test(value);
})
});
functionvalidarFormulario(){
//Reglas de validación
$("#formulario").validate({
rules:{
//Validar el nombre
nombre:{
required: true,
latinos: true
},
//Validar la edad
edad:{
required: true,
digits: true,
min: 18,
max: 120
},
//Validar el correo electrónico
txtEmail: {
required: true,
email: true
},
//Validar el sexo
sexo:{
required: true
},
mensaje:{
maxlength: 255
}
}
//Mensajes de error
messages: {
nombre:{
required:"Debe introducir un nombre",
latinos:"Sólo se aceptan letras"
},
edad:{
required: "Debe introducir su edad",
digits: "Debe introducir sólo números",
min:"La edad debe ser entre 18 y 120",
max: "La edad debe ser entre 18 y 120"
},
txtEmail:{
required:"El campo email es obligatorio",
email:"El formato de email es incorrecto"
},
sexo:{
required: "Debe indicar su sexo"
},
mensaje:{
maxlength: "El mensaje tiene demasiadas letras
(máximo 255)"
}
}
});
}
</script>
</head>
<body>
<form action="" id="formulario">
<fieldset>
<legend>Información de Contacto</legend>
<label for="nombre">Nombre: </label>
<input type="text" id="nombre" name="nombre"><br><br>
<label for="edad">Edad: </label>
<input type="text" id="edad" name="edad"><br><br>
<label for="txtEmail">Email: </label>
<input type="text" id="txtEmail" name="txtEmail"><br><br>
<label for="sexo">Sexo: </label>
<input type="radio" id="masculino" name="sexo" value="Masculino">Masculino
<input type="radio" id="femenino" name="sexo" value="Femenino">Femenino <br><br>
<label for="mensaje">Mensaje: </label><br>
<textarea name="mensaje" id="mensaje" cols="40"rows="5"></textarea><br><br>
<input type="submit" id="enviar" name="enviar" value="Enviar">
<input type="reset" id="borrar" name="borrar" value ="Borrar">
</fieldset>
</form>
</body>
</html>