HTML 属性:minlength
minlength
属性定义用户可以输入到 <input>
或 <textarea>
中的最小 字符串长度。该属性必须具有 0 或更高的整数值。
长度以 UTF-16 代码单元为单位测量,这 (对于大多数脚本) 等同于字符数。如果没有指定 minlength
,或者指定了无效值,则输入没有最小长度。此值必须小于或等于 maxlength 的值,否则该值将永远无效,因为不可能同时满足这两个条件。
如果字段文本值的长度小于 minlength 个 UTF-16 代码单元,则输入将无法通过约束验证,并且 validityState.tooShort
将返回 true
。约束验证仅在用户更改值时应用。提交失败后,某些浏览器将显示错误消息,指示所需的最小长度和当前长度。
minlength
并不意味着 required
;如果用户已输入值,则输入仅在违反 minlength
约束时才违反。如果输入不是 required
,则即使设置了 minlength
,也可以提交空字符串。
试试看
示例
通过添加 minlength="5"
,该值必须为空或至少包含五个字符才能有效。
html
<label for="fruit">Enter a fruit name that is at least 5 letters long</label>
<input type="text" minlength="5" id="fruit" />
我们可以使用伪类根据值是否有效来设置元素的样式。只要值为空(空)或至少包含五个字符,该值就有效。Lime 无效,lemon 有效。
css
input {
border: 2px solid currentcolor;
}
input:invalid {
border: 2px dashed red;
}
input:invalid:focus {
background-image: linear-gradient(pink, lightgreen);
}
规范
规范 |
---|
HTML 标准 # attr-input-minlength |
HTML 标准 # attr-textarea-minlength |
浏览器兼容性
html.elements.input.minlength
BCD 表格仅在浏览器中加载
html.elements.textarea.minlength
BCD 表格仅在浏览器中加载