限制 input 输入框只能输入纯数字

 onkeyup = "value=value.replace(/[^\d]/g,'')"

使用 onkeyup 事件，有 bug ，那就是在中文输入法状态下，输入汉字之后直接回车，会直接输入字母

onchange = "value=value.replace(/[^\d]/g,'')"

使用 onchange 事件，在输入内容后，只有 input 丧失焦点时才会得到结果，并不能在输入时就做出响应

oninput = "value=value.replace(/[^\d]/g,'')"

使用 oninput 事件，完美的解决了以上两种问题，测试暂时还没有出现其它问题。

代码示例

 <!DOCTYPE html>

 <html lang="en">

 <head>

 <meta charset="UTF-8" />

 <title>input</title>

 </head>

 <body>

 只能输入纯数字的输入框:<input type="text" name="" oninput="value=value.replace(/[^\d]/g,'')">

 </body>

 </html>

在HTML中限制input 输入框只能输入纯数字的更多相关文章

  1. input 输入框只能输入纯数字

    1.onkeyup = "value=value.replace(/[^\d]/g,'')" 使用 onkeyup 事件,有 bug ,那就是在中文输入法状态下,输入汉字之后直接回 ...

  2. 限制 input 输入框只能输入纯数字

    oninput = "value=value.replace(/[^\d]/g,'')"

  3. 购物车中的input输入框只能输入数字和输入为0的时候默认为1

    <input type="text" value="1" onkeyup="value=(parseInt((value=value.repla ...

  4. 【JS】input输入框只能输入数字

    一.实现思路 input只能输入纯数字的思路其实很简单,监听输入框值的变化,每次输入检索输入框的值,将非数字的字段替换成空,再将此值赋予给输入框. 关键代码: \d:匹配数字 ^/d:全文匹配非数字 ...

  5. input输入框 只能输入数字 oninput = "value=value.replace(/[^\d]/g,'')" input输入框输入大于0的数字 oninput="value=value.replace(/\D|^0/g,'')"

    项目中因为利用 element-ui 和avue两个ui框架搭建的 1.利用element-ui自带的校验需要注意点 prop  :rules ref这三个属性 2.利用oninput时间进行校验   ...

  6. input输入框只能输入数字和 小数点后两位

    //input输入框只能输入数字和 小数点后两位 function num(obj,val){ obj.value = obj.value.replace(/[^\d.]/g,"" ...

  7. Html限制input输入框只能输入数字

    限制输入框只能输入数字, onafterpaste防止用户从其它地方copy内容粘贴到输入框: <input type="text" onkeyup="this.v ...

  8. input输入框只能输入正整数、字母、小数、汉字

    只需将需要的代码加入到input输入框中,即可使用! 1,文本框只能输入数字代码(小数点也不能输入) 代码如下: <input onkeyup="this.value=this.val ...

  9. JS通过正则限制 input 输入框只能输入整数、小数(金额或者现金)

    第一: 限制只能是整数 <input type = "text" name= "number" id = 'number' onkeyup= " ...

随机推荐

  1. IO模型--阻塞IO,非阻塞IO,IO多路复用,异步IO

    IO模型介绍: * blocking IO 阻塞IO * nonblocking IO 非阻塞IO * IO multiplexing IO多路复用 * signal driven IO 信号驱动IO ...

  2. day16_python_1124

    圈子 圈子是互相影响,走着走着就散了. 道不同不相为谋,与人的认知相关. 圈子如何正向引导? 圈子能决定你的人生走向. 圈子能决定你的格局. 01 昨日内容回顾 序列化模块 将一个数据结构 ----& ...

  3. 一个简易的allocator

    #include <vector> #include <iostream> #include <algorithm> using namespace::std; t ...

  4. linux c++ curl https 请求并双向验证SSL证书

    1.配置curl https请求需要提供 CA证书.客户端证书和客户端秘钥,这三个文件的pem格式. 分别对应 curl_easy_setopt() 函数的 下面三个参数: CURLOPT_CAINF ...

  5. JavaWeb基础-servlet

    Servlet简介 Sun公司在其API中提供了一个servlet接口,用户若想用发一个动态web资源(即开发一个Java程序向浏览器输出数据),需要完成以下2个步骤: 1.编写一个Java类,实现s ...

  6. python私有属性和私有方法

    私有属性和私有方法 01. 应用场景及定义方式 应用场景 在实际开发中,对象 的 某些属性或方法 可能只希望 在对象的内部被使用,而 不希望在外部被访问到 私有属性 就是 对象 不希望公开的 属性 私 ...

  7. wpf-X名称空间Attribute

    1.x:class 该属性用于 后台代码与前端xaml代码连接 代码实例如下图 2.x:ClassModifier 该属性用于控制可见级别  public 等 与C#中的可见级别相同 internal ...

  8. Java错误：结束的字符文字

    编译器为NetBeans 在学习java的时候突然出现了以下错误 错误代码是: Gen <Integer ,String> a = new Gen <Integer, String& ...

  9. net core 解除上传大附件的限制

    1.对于使用自带服务器kernal的情况下,只需要在对应的action上添加属性 DisableRequestSizeLimit [HttpPost] [DisableRequestSizeLimit ...

  10. lua经典问题

    lua是一门比较简单的脚本语言,但是有些问题经常碰到,在这里总结一下: 1 lua 传参,如果参数是table,则相当于传引用 2 lua中只有nil和false返回假 3 lua and 和 or ...