Validar valor de un input

Problema:

Validar el valor tecleado en un campo input

Aunque HTML 5 permite varias formas de comprobar o limitar los vlores introducidos en eun campo input, puede ser necesario alguna validadción concreta para un script determinado.

Por ejemplo queremos que se introduzca un nombre de  día de la semana y que no sea el domingo.

Solución

Usar blur, evento disparado al salir del input.

Aunque un form uede verficarse o validarse en el momento de enviarlo, también podemos verificar los campos individualemnte.

El evento blur es el contrario al evento focus. Se dispara cuando el cursor sale del campo, es decir, cuando el input pierde el foco.

Ejemplo

En este ejemplo se usa un formulario con un elemento textarea y solo permite los días de la semana entre lunes y sábado.

<form name="form1" method="post" action="">

<label>Teclear un día de la semana</label>

<input type="text" name="dia" id="dia" onblur="validar(this.value)">

<label>Encargado</label>

<input type="text" name="dia" id="dia" onblur="validar(this.value)"><br>

<input type="submit" name="Enviar" value="Enviar">

</form>

<script>

function validar(valor){

  let valor = event.currentTarget.value.toLowerCase();

  let dias = new Array('lunes', 'martes', 'miércoles', 'jueves', 'viernes')

  if (!dias.includes(valor){

     event.currentTarget.value="dia inválido";

     event.currentTarget.focus();

    }

}

</script>

Ojo, esto solo verifica el campo input cuado es escrito, no valida el formulario al pulsar el botón submit, esa es otra tarea.

scripts