HTML5中是否有minlength验证属性？

最新推荐文章于 2024-03-14 17:48:15 发布

CHCH998

最新推荐文章于 2024-03-14 17:48:15 发布

阅读量1k

点赞数

文章标签： html5 html5-validation

原文链接：https://oldbug.net/q/h8o6/Is-there-a-minlength-validation-attribute-in-HTML5

版权

本文翻译自：Is there a minlength validation attribute in HTML5?

It seems the minlength attribute for an <input> field doesn't work. 似乎<input>字段的minlength属性不起作用。

Is there any other attribute in HTML5 with the help of which I can set the minimal length of a value for fields? HTML5中是否还有其他属性可以帮助我设置字段值的最小长度？

#1楼

参考：https://stackoom.com/question/h8o6/HTML-中是否有minlength验证属性

#2楼

minLength attribute (unlike maxLength) does not exist natively in HTML5. minLength属性（与maxLength不同）在HTML5中本身不存在。 However there a some ways to validate a field if it contains less than x characters. 但是，有一些方法可以验证字段是否包含少于x个字符。

An example is given using jQuery at this link : http://docs.jquery.com/Plugins/Validation/Methods/minlength 在此链接中使用jQuery给出了一个示例： 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>

#3楼

You can use the pattern attribute . 您可以使用pattern属性。 The required attribute is also needed, otherwise an input field with an empty value will be excluded from constraint validation . 还需要required属性，否则将从约束验证中排除具有空值的输入字段。

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

If you want to create the option to use the pattern for "empty, or minimum length", you could do the following: 如果要创建将模式用于“空或最小长度”的选项，可以执行以下操作：

<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)">

#4楼

Here is HTML5-only solution (if you want minlength 5, maxlength 10 character validation) 这是HTML5专用解决方案 （如果你想要minlength 5，maxlength 10字符验证）

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

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

#5楼

There is a minlength property in HTML5 spec now, as well as the validity.tooShort interface. 有一个minlength物业HTML5规范现在，还有validity.tooShort接口。

Both are now enabled in recent versions of all modern browsers. 两者现在都在所有现代浏览器的最新版本中启用。 For details, see https://caniuse.com/#search=minlength . 有关详细信息，请参阅https://caniuse.com/#search=minlength 。

#6楼

Yes, there it is. 是的，就是这样。 It's like maxlength. 这就像maxlength。 W3.org documentation: http://www.w3.org/TR/html5/forms.html#attr-fe-minlength W3.org文档： http ： //www.w3.org/TR/html5/forms.html#attr-fe-minlength

In case minlength doesn't work, use the pattern attribute as mentioned by @Pumbaa80 for the input tag. 如果minlength不起作用，请使用@ Pumbaa80提到的pattern属性作为input标记。

For textarea: For setting max; 对于textarea：设置最大值; use maxlength and for min go to this link . 使用maxlength和min转到此链接。

You will find here both for max and min. 你会在这里找到最大和最小。