input number 数字输入限制,最大值最小值输入范围限制

2022-03-07 09:06:47 浏览数 (1)

方式一:max="100" min="10" 这种方式限制的是数字输入框右边的增减箭头按钮,最大值和最小值,不能对手动输入的数进行限制。如果手动输入一个大于100或小于10的数,还是无法限制。

代码语言:javascript复制
<input type="number" max="100" min="10" value="">

方式二:oninput // 只限制长度:输入四位数的数字

代码语言:javascript复制
<input type="number" oninput="if(value.length>4)value=value.slice(0,4)" />

// 只限制最大值100:最大为100,即使手动输入大于100的数也会自动变成100

代码语言:javascript复制
<input type="number" oninput="if(value>100)value=100" />

// 只限制最小值0:最小为0,即使手动输入小于0的负数也会自动变成0

代码语言:javascript复制
<input type="number" oninput="if(value<0)value=0" />

// 均作限制:长度4 最大值100 最小值0

代码语言:javascript复制
<input type="number" oninput="if(value>100)value=100;if(value.length>4)value=value.slice(0,4);if(value<0)value=0" />

0 人点赞