有一个输入框，要求只能输入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的问题的更多相关文章

  1. input type="number" 时 maxlength不起作用

    给input标签添加 oninput=“if(value.length>11) value=value.slice(0,11)”

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

    https://blog.csdn.net/weistin/article/details/79664261 vue type="number   设置maxlength 是无效的 我们可以 ...

  3. input属性设置type="number"之后, 仍可输入e；input限制只输入数字

    只需在行内输入   onKeyUp="this.value=this.value.replace(/[^\.\d]/g,'');"     就解决了   <input typ ...

  4. input输入框type=number时的一个缺陷

    本来是在vue里发现获取不到 input[ type="number"]的值,就是输入两个小数点的数值,比如1.1.1,以为是vue的错误,然而不是,vue只做了数字处理 不明白为 ...

  5. 移动端 输入框 如果类型是number，用户也可以输入汉字和字母

    <input type="number" id="input-age" placeholder="请输入你的年龄" /> //i ...

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

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

  7. html：input的type=number的时候maxlength失效问题

    <input type="text"  maxlength="5" />   效果ok,当 <input type="number& ...

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

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

  9. input输入框type设置为number，maxlength无效

    一个小细节,以前很少注意,直到最近做的一个项目,当我把一个输入数字的input框的类型设置为number时,input框还是可以无限输入,设置maxlengh=10就不起作用了.然后我就去百度了一下, ...

随机推荐

  1. Spark数据分析-记录关联问题

    1. 问题描述 记录关联问题(Record Linkage):有大量从一个或多个源系统来的记录,其中有些记录可能代表了相同的基础实体. 每个实体有若干个属性,比如姓名.地址.生日.我们需要根据这些属性 ...

  2. kibana升级之后原本保存的数据dashboards, visualizations, index patterns丢失

    1,es升级注意的问题:https://www.elastic.co/guide/en/elasticsearch/reference/6.5/rolling-upgrades.html 2,kiba ...

  3. string部分方法

    1.string.lastIndexOf() lastIndexOf 是从string末尾查找,但是返回值仍是首部的位置值. 2.string.replace() 放一个正则匹配会全部替换. 3.st ...

  4. 原生JS获取DOM 节点到浏览器顶部的距离或者左侧的距离

    关于js获取dom 节点到浏览器顶/左部的距离,Jquery里面有封装好的offset().top/offset().left,只到父级的顶/左部距离position().top/position() ...

  5. centos7系统运行级别简介

    centos7系统运行级别简介我们知道,centos6及之前的版本中,系统运行级别通过/etc/inittab文件进行设置和控制,但在centos7中,对这个文件的设置将不会对系统运行级别产生影响,这 ...

  6. vue组件局部与全局注册的区别

    //局部注册 var mycomponent = new extend({        <!--Vue.extend()是Vue构造器的扩展,调用Vue.extend()我们将创建一个组件构造 ...

  7. jQueryValidate的表单提交ajax刷新代码

    $("#form-member-add").validate({ rules:{ username:{ required:true, minlength:2, maxlength: ...

  8. keepalived高可用集群。

    keepalived故障切换转移原理1vrrp协议:(vritual router redundancy protocol)虚拟路由冗余协议,2故障转移.keepalived三大功能1实现物理高可用, ...

  9. PAT B1029

    # PAT B1029 这道题主要有两个问题需要解决: 如何在不区分大小写的情况下判断第一个字符串中有哪些字符串没有在第二个中出现 如何确保同一个字符(不区分大小写)只输出一次,且英文均用大小写输出 ...

  10. C# 注册机功能开发，机器码设计

    前言 本文将使用一个NuGet公开的组件技术来实现机器码注册码功能开发,提供了一些简单的API,来方便的实现. 在Visual Studio 中的NuGet管理器中可以下载安装,也可以直接在NuGet ...