¿Hay un atributo de validación de longitud mínima en HTML?

Question 1

parece que minlength atributo para un <input> el campo no funciona.

¿Hay algún otro atributo en HTML con la ayuda del cual pueda establecer la longitud mínima de un valor para los campos?

Question 2

Puedes usar el pattern atributo. Él required atributo también es necesario, de lo contrario, un campo de entrada con un valor vacío se excluirá de validación de restricciones.

<input pattern=".{3,}"   required title="3 characters minimum">
<input pattern=".{5,10}" required title="5 to 10 characters">

Si desea crear la opción para usar el patrón para “longitud mínima o vacía”, puede hacer lo siguiente:

<input pattern=".{0}|.{5,10}" required title="Either 0 OR (5 to 10 chars)">
<input pattern=".{0}|.{8,}"   required title="Either 0 OR (8 chars minimum)">

Question 3

Allí es a minlength propiedad en la especificación HTML5 ahora, así como el validity.tooShort interfaz.

Ambos ahora están habilitados en versiones recientes de todos los navegadores modernos. Para más detalles, consulte https://caniuse.com/#search=minlength.

Question 4

Aquí hay una solución solo para HTML5 (si desea validación de caracteres minlength 5, maxlength 10)

http://jsfiddle.net/xhqsB/102/

    <form>
      <input pattern=".{5,10}">
      <input type="submit" value="Check"></input>
    </form>

Question 5

Sí, ahí está. Es como longitud máxima. Documentación de W3.org:
http://www.w3.org/TR/html5/forms.html#attr-fe-minlength

En caso minlength no funciona, usa el pattern atributo mencionado por @ Pumbaa80 para el input etiqueta.

Para el área de texto:
Para configurar max; utilizar maxlength y por min ir a este enlace.

Aquí encontrará tanto para max como para min.

Question 6

Usé maxlength y minlength con o sin required y me funcionó muy bien para HTML5.

<input id="passcode" type="password" minlength="8" maxlength="10">

`

Question 7

minlength atributo es ahora ampliamente compatible en la mayoría de los navegadores.

<input type="text" minlength="2" required>

Pero, al igual que con otras características de HTML5, IE11 no se incluye en este panorama. Entonces, si tiene una amplia base de usuarios de IE11, considere usar el pattern Atributo HTML5 que se admite casi en todos los ámbitos en la mayoría de los navegadores (incluyendo IE11).

Para tener una implementación agradable y uniforme y tal vez extensible o dinámica (basada en el marco que genera su HTML), votaría por el pattern atributo:

<input type="text" pattern=".{2,}" required>

Todavía hay una pequeña trampa de usabilidad cuando usas pattern. El usuario verá un mensaje de error/advertencia no intuitivo (muy genérico) cuando utilice pattern. Ver este jsfiddle o por debajo:

<h3>In each form type 1 character and press submit</h3>
</h2>
<form action="#">
  Input with minlength: <input type="text" minlength="2" required name="i1">
  <input type="submit" value="Submit">
</form>
<br>
<form action="#">
  Input with patern: <input type="text" pattern=".{2,}" required name="i1">
  <input type="submit" value="Submit">
</form>

Por ejemplo, en Chrome (pero similar en la mayoría de los navegadores), obtendrá los siguientes mensajes de error:

Please lengthen this text to 2 characters or more (you are currently using 1 character)

mediante el uso minlength y

Please match the format requested

mediante el uso pattern.

Question 8

Observé que, a veces, en Chrome, cuando la función de autocompletar está activada y los campos se realizan mediante el método de compilación del navegador de autocompletar, omite las reglas de validación de longitud mínima, por lo que en este caso tendrá que deshabilitar la función de autocompletar mediante el siguiente atributo:

autocompletar=”desactivado”

<input autocomplete="new-password" name="password" id="password" type="password" placeholder="Password" maxlength="12" minlength="6" required />

¿Ha sido útil esta solución?