Pregunta ¿Hay un atributo de validación minlength en HTML5?


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

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


502
2018-04-23 13:56


origen


Respuestas:


Puedes usar el pattern atributo. los required atributo también es necesario; de lo contrario, se excluirá un campo de entrada con un valor vacío 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 "vacío, o longitud mínima", podría 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)">

1108
2018-04-24 08:24



Ahí es un minlength propiedad en Especificación de 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, ver https://caniuse.com/#search=minlength.


113
2018-06-27 09:31



Aquí hay una solución solo HTML5 (si quieres minlength 5, maxlength 10 validacion de caracteres)

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

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

15
2017-08-12 11:02



Sí, ahí está. Es como maxlength. 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 textarea: Para establecer max; utilizar maxlength y para min ir a este enlace.

Aquí encontrarás tanto para max como para min.


10
2017-07-06 10:52



No HTML5, pero práctico de todos modos: si usa AngularJS, puedes usar ng-minlength para ambas entradas y áreas de texto. Ver también esto Plunk.


5
2017-09-22 12:04



El atributo minLength (a diferencia de maxLength) no existe de forma nativa en HTML5. Sin embargo, hay algunas formas de validar un campo si contiene menos de x caracteres.

Un ejemplo se da usando jQuery en este enlace: http://docs.jquery.com/Plugins/Validation/Methods/minlength

<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<script type="text/javascript">
jQuery.validator.setDefaults({
    debug: true,
    success: "valid"
});;
</script>

  <script>
  $(document).ready(function(){
    $("#myform").validate({
  rules: {
    field: {
      required: true,
      minlength: 3
    }
  }
});
  });
  </script>
</head>
<body>

<form id="myform">
  <label for="field">Required, Minimum length 3: </label>
  <input class="left" id="field" name="field" />
  <br/>
  <input type="submit" value="Validate!" />
</form>

</body>
</html>

4
2018-04-23 14:11



Mi solución para textarea usando jQuery y la combinación de HTML5 requiere validación para verificar la longitud mínima.

minlength.js

$(document).ready(function(){
  $('form textarea[minlength]').on('keyup', function(){
    e_len = $(this).val().trim().length
    e_min_len = Number($(this).attr('minlength'))
    message = e_min_len <= e_len ? '' : e_min_len + ' characters minimum'
    this.setCustomValidity(message)
  })
})

HTML

<form action="">
  <textarea name="test_min_length" id="" cols="30" rows="10" minlength="10"></textarea>
</form>

3
2018-01-13 17:47