当给 input 设置类型为 number 时,比如,我想限制,只能输入 0-9 的正整数,正则表达式如下:

/^[-]?$/  // 匹配 0-9 的整数且只匹配 0 次或 1 次

用正则测试,小数点是无法通过的,且,因为 设置了类型为 number,也无法输入字母,

但实际上,1. 类似这样的不合规则的数字是可以通过验证的,且,可以键入字母 e,因为 e 在不同范围也有不同的意义,我们默认认为e也代表一个数字。

解决办法如下:

<input type='number' onkeypress='return( /[\d]/.test(String.fromCharCode(event.keyCode) ) )' />

这样,就不能输入 e 或者 小数点了

解决 html5 input type='number' 类型可以输入e的更多相关文章

  1. input的number类型只能输入正数,禁止负数输入

    <input type="number" max="10" min='1' id='number'> <script> document ...

  2. 【笔记】移动端H5数字键盘input type=number的处理(IOS和Android)

    在Vue中的项目,基于VUX-UI开发,一个常见的需求: 1.金额输入框 2.弹出数字键盘 3.仅支持输入两位小数,限制最大11位数,不允许0开头 后续:与UI沟通后, 思路调整为限制输入,并减少正则 ...

  3. 兼容IE7、IE8、IE9的input type="number"插件

    IE11版本好像才兼容input type="number",但是现在Win7版本操作系统下,很多人的IE版本都是IE7/8/9,所以为了体验就自己写了一个小插件,支持设置最大值. ...

  4. 输入类型<input type="number"> / input标签的输入限制

    输入限制 属性 描述 disabled 规定输入字段应该被禁用. max 规定输入字段的最大值. maxlength 规定输入字段的最大字符数. min 规定输入字段的最小值. pattern 规定通 ...

  5. 限制input[type=number]的输入位数策略整理

    当我们使用类型number的input输入框的时候,我们可能需要限制输入的位数,这个时候通常会想到maxlength,但是maxlength是在number类型的时候是不支持的,下面是一些解决这种问题 ...

  6. 解决input为number类型时maxlength无效的问题

    使用input数字number类型的时候maxlength无效,假设需要控制输入数量为18,可以用以下方式: 无效: <input type="text"  maxlengt ...

  7. 如何移除HTML5的type=""number""的input标签的上下箭头

    初次使用input的数字输入类型type="number"时会发现默认有个上下的箭头,如下图: 很明显这里不需要这个默认箭头,那么我们如何移出这个默认样式呢? 第一种方式,写css ...

  8. input type="number"时,maxlength不起作用怎么解决

    最近小颖在做公司的angular项目时,发现当input type="number"时,maxlength不起作用,百度了下解决方式,顺便记录下,以便后期查看嘻嘻 <inpu ...

  9. 动手写个数字输入框1:input[type=number]的遗憾

    前言  最近在用Polymer封装纯数字的输入框,开发过程中发现不少坑,也有很多值得研究的地方.本系列打算分4篇来叙述这段可歌可泣的踩坑经历: <动手写个数字输入框1:input[type=nu ...

随机推荐

  1. USB编程概念

     RE:USB编程概念 >请你指导我如何学习USB虚拟COM端口PROGRAMM,什么是我们needto有(如硬件和软件)的东西. USB是一个典型的复杂的协议栈,在协议的协议.这是很难完全实现 ...

  2. POJ 2001 Shortest Prefixes (Trie)

    题目链接:POJ 2001 Description A prefix of a string is a substring starting at the beginning of the given ...

  3. DB2连接

    ibm_db.connect 创建非持久连接. ibm_db.pconnect 创建持久连接. 在最初的Python脚本请求之后,持久的连接保持打开状态,这允许后续的Python请求重新使用连接. 后 ...

  4. [USACO10MAR]伟大的奶牛聚集Great Cow Gat…

    题目描述 Bessie is planning the annual Great Cow Gathering for cows all across the country and, of cours ...

  5. layout(布局)组件

    一.依赖于 Panel(面 板)组件和 resizable(调整大小)组件. 二.class加载方式    <div id="box" class="easyui- ...

  6. javascript 中的函数

    /*   第二天   */ 函数 函数是js里最有趣的东西了,函数实际上就是对象,每个函数Function类型的实例,函数名实际上是指向函数对象的指针.不带圆括号的函数时访问函数的指针,带圆括号的是调 ...

  7. HTML + CSS (下)【更新中】

    弹性盒子: 定义:弹性盒子模型是css3中新提出的一种布局方案.是一种为了应对针对不同屏幕宽度不同设备的一整套新的布局方案. 主要是对一个容器中的子元素进行排列.对齐和分配空白空间的方案的调整. 新旧 ...

  8. Alpha版本后的心得体会

    Alpha版本后的心得体会 在我们一系列的努力之下,我们团队打造的校园互助式快递代取APP——U-Help的α版本终于能够问世了.尽管这个版本存在着这样那样的问题,但是我们还是对此抱有充足的信心.另一 ...

  9. junit单元测试报错Failed to load ApplicationContext,但是项目发布到tomcat浏览器访问没问题

    junit单元测试报错Failed to load ApplicationContext,但是项目发布到tomcat浏览器访问没问题,说明代码是没问题的,配置也没问题.开始时怀疑是我使用junit版本 ...

  10. Codeforces 1149D 最短路 状压DP

    题意及思路:https://blog.csdn.net/yzyyylx/article/details/90145400 这题主要巧妙在分析了最短路算法的性质,得出大小小于等于3的连通块一定不会被再次 ...