HTML 属性:max
max
属性定义了输入字段所能接受的最大值。如果元素的 value
大于此值,则该元素将不能通过校验。此值必须大于等于 min
属性的值。如果存在 max
属性但未指定或无效,则 max
值不会被应用。如果 max
属性有效,并且非空值大于 max
属性所允许的最大值,则约束验证将阻止表单提交。
max 属性适用于数值类型的输入,包括 date、month、week、time、datetime-local、number 和 range 类型,以及 <progress>
和 <meter>
元素。它是一个数值,用于指定表单控件被认为有效的最大正值。
如果值超出了允许的最大值,validityState.rangeOverflow
将为 true
,且控件会匹配 :out-of-range
和 :invalid
伪类。
语法
输入类型 | 语法 | 示例 |
---|---|---|
date | yyyy-mm-dd |
<input type="date" max="2019-12-25" step="1"> |
month | yyyy-mm |
<input type="month" max="2019-12" step="12"> |
week | yyyy-W## |
<input type="week" max="2019-W23" step=""> |
time | HH:mm |
<input type="time" max="17:00" step="900"> |
datetime-local | yyyy-mm-ddTHH:mm |
<input type="datetime-local" max="2019-12-25T23:59">
|
number | <number> |
<input type="number" min="0" step="5" max="100">
|
range | <number> |
<input type="range" min="60" step="5" max="100">
|
备注:
当用户输入的数据不符合设置的最大值时,该值在约束验证中被视为无效,并会匹配 :invalid
和 :out-of-range
伪类。
请参阅客户端验证和 rangeOverflow
了解更多信息。
对于 <progress>
元素,max
属性描述了 progress
元素所表示的任务一共需要完成多少工作。如果该属性存在,必须具有大于零的值,并且是有效的浮点数。对于 <meter>
元素,max
属性定义了测量范围的上限值。此值必须大于最小值(如果指定了min
属性)。在这两种情况下,如果省略,默认值为 1。
元素类型 | 语法 | 示例 |
---|---|---|
<progress> |
<number> |
<progress id="file" max="100" value="70"> 70%
</progress>
|
<meter> |
<number> |
<meter id="fuel" min="0" max="100" low="33" high="66"
optimum="80" value="40"> at 40/100</meter>
|
无障碍考虑
提供帮助用户了解如何填写表单并使用各个表单控件的指引。标明任何必填和可选的输入项、数据格式以及其他相关信息。在使用 max
属性时,确保用户理解最大值的要求。可以通过 <label>
提供说明。如果需要在标签之外提供上述说明以实现更灵活的布局设计,请考虑使用 aria-labelledby
或 aria-describedby
。
规范
Specification |
---|
HTML Standard # attr-input-max |
HTML Standard # attr-meter-max |
HTML Standard # attr-progress-max |
浏览器兼容性
html.elements.input.max
BCD tables only load in the browser
html.elements.meter.max
BCD tables only load in the browser
html.elements.progress.max
BCD tables only load in the browser