有一个输入框，要求只能输入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. Mysql增量恢复

    mysqldump增量恢复何时需要使用备份的数据? 备份最牛逼的层次,就是永远都用不上备份.--老男孩 不管是逻辑备份还是物理备份,备份的数据什么时候需要用?===================== ...

  2. linux软件管理之yum管理rpm包

    YUM 使用官方源 ==================================================================================== 阿里镜像站 ...

  3. android ------ RecyclerView 模仿淘宝购物车

    电商项目中常常有购物车这个功能,做个很多项目了,都有不同的界面,选了一个来讲一下. RecyclerView 模仿淘宝购物车功能(删除选择商品,商品计算,选择, 全选反选,商品数量加减等) 看看效果图 ...

  4. 5、SAMBA服务二：配置实例

    ①:SAMBA服务一:参数详解 ②:SAMBA服务二:配置实例 5.2.3.Samba共享目录配置实例 1.允许匿名用户读取/it共享目录,修改/etc/samba/smb.conf,在最后添加以下内 ...

  5. jQuery 省份选择

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 布局神器 display:flex;

    布局神器 display:flex; 2009年,W3C提出了一种新的方案--Flex布局,可以简便.完整.响应式地实现各种页面布局.目前已得到所有现在浏览器的支持. 一.Flex布局是什么? Fle ...

  7. Linux下一个进程可以开多少线程

    这个问题,整理了一下网上的资料,结果如下: 一.ulimit -n可以查看一个进程最多可以打开多少文件描述符数: 二.一个进程最多可以产生多少线程,可用如下的方法: 32位linux系统最大内存地址4 ...

  8. unity中获取七天的日期

    private List<string> Date; private List<string> Day; private string now; private WMG_Axi ...

  9. WindowsForms 调用API

    WindowsForms 后台 using System;using System.Collections.Generic;using System.ComponentModel;using Syst ...

  10. hadoop Non DFS Used是什么

    首先我们先来了解一下Non DFS User是什么? Non DFS User的意思是:非hadoop文件系统所使用的空间,比如说本身的linux系统使用的,或者存放的其它文件   它的计算公式: n ...