有一个输入框,要求只能输入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. chrome 调试功能使用说明

    单文件搜索 ctrl+f 全局搜索 ctrl+shift+f

  2. JxBrowser之五:清除cache和cookie以及SSL证书处理

    1.清除cache和cookie //清除cache browser.getCacheStorage().clearCache(); browser.getLocalWebStorage().clea ...

  3. 获取url "?" 后面的字符串

    今天写了一个URL “?” 后面的字符串 来改变当前页面的状态 首先需要获取当前页面的URL console.log(widow.location) 之后页面就会打印出来当前的URL 之后我们获取UR ...

  4. 『TensorFlow』滑动平均

    滑动平均会为目标变量维护一个影子变量,影子变量不影响原变量的更新维护,但是在测试或者实际预测过程中(非训练时),使用影子变量代替原变量. 1.滑动平均求解对象初始化 ema = tf.train.Ex ...

  5. BOM&DOM

    BOM(浏览器对象模型) 1. location相关 . location.href 获取当前url . location.href="http://www.sogo.com" 跳 ...

  6. CentOS 6快捷安装RabbitMQ教程

    1.安装Erlang yum install erlang 2.安装RabbitMQ yum install rabbitmq-server 3.配置开机自启动 chkconfig rabbitmq- ...

  7. Java IO编程全解(二)——传统的BIO编程

    前面讲到:Java IO编程全解(一)——Java的I/O演进之路 网络编程的基本模型是Client/Server模型,也就是两个进程之间进行相互通信,其中服务端提供位置信息(绑定的IP地址和监听端口 ...

  8. java项目改为web项目

     1.进入项目目录,可看到.project文件,打开. 2.找到<natures...</natures代码段. 3.在第2步的代码段中加入如下标签内容并保存: <nature& ...

  9. lua调用方法错误

    self.sendMsg(json.encode(info),) self:sendMsg(json.encode(info),) 两个符号就差了一个点,引发的问题确实app崩溃,在这个方法中传的参数 ...

  10. Java中==和equals的比较

    1.== (1)基本数据类型:比较值  基本类型有8种: 整数型:byte 字节类型:1个字节(8位) short 短整型:2个字节(16位) int  整数类型:4个字节(32位)   Java默认 ...