type=number 的maxlength和可以输入E的问题
有一个输入框,要求只能输入1到999以下数字,于是
设置<input type="number" min="1" max="999">
结果发现可以输入e.因为e是一个常数。
使用网上的解决办法加入:
onkeypress='return( /[\d]/.test(String.fromCharCode(event.keyCode)))
这样解决了可以输入E的问题,但是这样输入框输入的数字可以大于999了。。
最后面采用以下方法解决:
<input type="number" min="1" max="9999" maxlength="4" oninput="value=value.replace(/e/g,'');if(value.length>4)value=value.slice(0,4)">
以上发现还是有问题,被全部替换了。最终,改成type="text",输入后用正则替换完所有非数字字符后,再取左4位
<input type="text" oninput="value=value.replace(/[^\d]/g,'');if(value.length>4)value=value.slice(0,4)">
或是
<input type="text" maxlength="4" oninput="value=value.replace(/[^\d]/g,'')">
type=number 的maxlength和可以输入E的问题的更多相关文章
- input type="number" 时 maxlength不起作用
给input标签添加 oninput=“if(value.length>11) value=value.slice(0,11)”
- vue 限制input[type=number]的输入位数策略整理
https://blog.csdn.net/weistin/article/details/79664261 vue type="number 设置maxlength 是无效的 我们可以 ...
- input属性设置type="number"之后, 仍可输入e;input限制只输入数字
只需在行内输入 onKeyUp="this.value=this.value.replace(/[^\.\d]/g,'');" 就解决了 <input typ ...
- input输入框type=number时的一个缺陷
本来是在vue里发现获取不到 input[ type="number"]的值,就是输入两个小数点的数值,比如1.1.1,以为是vue的错误,然而不是,vue只做了数字处理 不明白为 ...
- 移动端 输入框 如果类型是number,用户也可以输入汉字和字母
<input type="number" id="input-age" placeholder="请输入你的年龄" /> //i ...
- 限制input[type=number]的输入位数策略整理
当我们使用类型number的input输入框的时候,我们可能需要限制输入的位数,这个时候通常会想到maxlength,但是maxlength是在number类型的时候是不支持的,下面是一些解决这种问题 ...
- html:input的type=number的时候maxlength失效问题
<input type="text" maxlength="5" /> 效果ok,当 <input type="number& ...
- 输入类型<input type="number"> / input标签的输入限制
输入限制 属性 描述 disabled 规定输入字段应该被禁用. max 规定输入字段的最大值. maxlength 规定输入字段的最大字符数. min 规定输入字段的最小值. pattern 规定通 ...
- input输入框type设置为number,maxlength无效
一个小细节,以前很少注意,直到最近做的一个项目,当我把一个输入数字的input框的类型设置为number时,input框还是可以无限输入,设置maxlengh=10就不起作用了.然后我就去百度了一下, ...
随机推荐
- 微信小程序,加载更多
html <!-- 头部 --> <view class='tab'> <view class="tab-new {{selected_new?'active' ...
- pagex/y offsetx/y screenx/y clientx/y 用法及区别
1 pagex/pagey:鼠标相对于整个页面的x/y坐标 注:整个页面的意思就是你整个页面的全部 例如:宽200px 高400px 那么pagex/y他们最大值就是它 2,offsetX/y与pa ...
- Struts2 环境配置
1.下载struts2开发包 2.将apps中的 Struts-blank.war 解压,里面的 lib 中就是所需jar包 3.新建一个web project项目,将jar包导入复制粘贴到lib中 ...
- 第一个Python窗体程序
新建ui_MainWindow.py文件 # encoding: UTF-8 # Qt相关和十字光标 from PyQt4.QtGui import * from PyQt4.QtCore impor ...
- (18)ProcessPoolExecutor进程池
# 新版本的进程池 ProcessPoolExecutor # 实例化进程池 ProcessPoolExcutor(cpu_count) # 异步提交任务 submit / map # 阻塞直到任务完 ...
- 第二周javaweb学习进度表
第一周 所花时间 三天 代码量 200行 博客量 3篇 知识点了解到的 学习到了HTML编程语言的相关知识比如checkbox复选框和radio单选按钮以及form表单的使用方法,form表单可以 ...
- php如何以post形式发送xm并返回xmll数据
post的数据为xml字符串,通过 $xml = simplexml_load_string($post_data);转换成xml对象 $header[] = "Content-type: ...
- 【转】 SQL - 生成指定范围内的随机数
DECLARE @Result INT DECLARE @Upper INT DECLARE @Lower INT SET @Lower = 1 SET @Upper = 10 SELECT @Res ...
- angular js中ng-model时间格式化
直接上带代码,事实上此时不用ng-model,直接用value即可 <div class="form-group m-b-sm"> <label class=&q ...
- NOIP竞赛须知
初赛报名 1.凡初.高中阶段的选手和同等年龄段中等专业学校的在校生均可以报名参加NOIP赛事. 2.选手以学籍学校为单位在指导教师处报名,由指导教师汇总本校学校报名情况并提交给NOI省特派员,由省特派 ...