对于<input type="number">元素,maxlength无效。如何限制该数字元素的最大长度?
当前回答
<input type="number" maxlength="6" oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);">
这对我来说没有任何问题
其他回答
更相关的属性是min和max。
这很简单,用一些javascript你可以模拟一个maxlength,看看:
//maxlength="2"
<input type="number" onKeyDown="if(this.value.length==2) return false;" />
//对于Angular,我添加了如下代码片段。 < div ng-app = " " > < >形式 输入数字:<input type="number" ng-model="number" onKeyPress="if(this.value.length==7) return false;" min="0"> > < /形式 <h1>输入:{{number}}</h1> < / div >
如果你使用"onkeypress"事件,那么你在开发(单元测试)时将不会受到任何用户限制。如果你有要求,不允许用户进入特定的限制后,看看这段代码,并尝试一次。
<input type="number" onchange="this.value=Math.max(Math.min(this.value, 100), -100);" />
或者如果你想什么都不能输入
<input type="number" onchange="this.value=this.value ? Math.max(Math.min(this.value,100),-100) : null" />
您可以指定min和max属性,这将只允许在特定范围内输入。
<!-- equivalent to maxlength=4 -->
<input type="number" min="-9999" max="9999">
然而,这只适用于旋转控制按钮。尽管用户可以输入大于允许的最大值的数字,但表单将不会提交。
截图来自Chrome 15
你可以在JavaScript中使用HTML5的oninput事件来限制字符的数量:
myInput.oninput = function () {
if (this.value.length > 4) {
this.value = this.value.slice(0,4);
}
}
推荐文章
- 给一个数字加上st, nd, rd和th(序数)后缀
- 为什么我的CSS3媒体查询不能在移动设备上工作?
- 用javascript检查输入字符串中是否包含数字
- 下一个元素的CSS选择器语法是什么?
- 我如何用CSS跨浏览器绘制垂直文本?
- 如何获得box-shadow在左侧和右侧
- 相对定位一个元素,而不占用文档流中的空间
- 从数字中移除无关紧要的尾随零?
- 如何在jQuery检索复选框值
- 禁用身体滚动
- 如何在删除前显示确认消息?
- 在一个CSS宽度的小数点后的位置是尊重?
- 检测输入是否有文本在它使用CSS -在一个页面上,我正在访问和不控制?
- 如何用jQuery清空输入字段
- 我怎么能选择一个特定的类的最后一个元素,而不是父里面的最后一个孩子?