input框设置onKeypress事件只能输入数字（兼容火狐和IE9）

最新推荐文章于 2021-06-04 19:46:58 发布
最新推荐文章于 2021-06-04 19:46:58 发布
阅读量2k 收藏 1
点赞数

https://segmentfault.com/q/1010000008818447

使用onInput()事件

oninput 是 HTML5 的标准事件，对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有用，在内容修改后立即被触发，不像 onchange 事件需要失去焦点才触发。oninput 事件在主流浏览器的兼容情况如下：

http://runjs.cn/detail/pfojehd8

若使用onKeypress事件在火狐上达不到这个效果，还是会有一个字母可以正常输入。

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>RunJS</title>
    </head>
    <body>
        <input type="text" onInput ="keypress(this)" />
    </body>
    </body>
</html>

// scripts
function keypress(_this){
    _this.value = _this.value.replace(/[^0-9]/g, '');
}



mht1829
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js给input控件添加onkeypress属性
ligang19970910的博客
08-17 901
js给input控件添加onkeypress属性 在前台直接添加onkeypress可以实现. <ul class="r1"> <li><span>1．标准监测 每小时生命体征、液体平衡的常规记录和计算</span><input onKeypress="if (event.keyCode < 45 || event.keyCode > 57)
火狐input只能输入数字
09-02
火狐input只能输入数字,只能是数字啊，
input的onkeypress与tabindex
river、的博客
12-05 738
onkeypress兼容处理 <input type="text" onkeypress="getKeyMonitoring(event)" id="monitoringVlaue" placeholder="请输入"> <span class="projectStateBtn monitoring" tabindex="2" onkeypress="getKeyMonitoring(event
只能输入数字的方法
kankankankan2222的专栏
11-27 1141
只能输入数字的方法： 首先谢谢这些作者，参考了这几篇文章。都很好的: http://www.cnblogs.com/codefly/archive/2011/12/07/2279316.html http://www.cnblogs.com/IAmBetter/archive/2012/01/10/2318328.html 利用这则： http://tech.it168.com/d/20
input输入框使用onkeypress实现回车启动按钮事件，另注：onkeypress、onkeyup与onkeydown的区别
tian_tian2
09-22 6248
input输入框使用onkeypress实现回车启动按钮事件,另注：onkeypress、onkeyup与onkeydown的区别 在做项目的过程中，经常会遇到，在input输入框中敲回车就可是搜索、登录或者是其他的一些事件，那么我觉得最简单的就是在input中加入这么一句代码： onkeypress="if(event.keyCode==13){ login();//要执行的方法 }" 在这边我也总结一下onkeypress、onkeyup与onkeydown的区别： onkeypress是在用户按下
文本框只能输入数字的实现方法(兼容IE火狐)
09-02
在网页开发中，有时我们需要限制用户在输入框（`<input>`）中只能输入数字，以确保数据的...为了兼容IE和Firefox，需要使用适当的事件处理和键码获取方式。同时，应考虑其他可能的输入方式，以提供更全面的输入限制。
兼容firefox的文本框只能输入两位小数的数字的代码
10-29
标题和描述提到的代码就是这样一个示例，它实现了在Firefox和其他浏览器（包括IE）中，文本框只能输入最多两位小数的数字，同时排除其他非数字字符。 首先，我们来看关键的JavaScript函数`checkNumber(e, txt)`。这...
IE和firefox浏览器的event事件兼容性汇总
09-05
本文将深入探讨IE和Firefox浏览器中event事件的兼容性问题。 1. **event对象的使用** 在IE浏览器中，事件处理函数可以直接访问到全局的`event`对象，而Firefox和其他遵循W3C标准的浏览器则不支持这种全局访问方式...
兼容FF和IE的动态table示例自写
12-09
在网页开发中，兼容性问题始终是一个棘手的挑战，特别是对于不同的浏览器，例如Firefox (FF) 和 Internet Explorer (IE)。本示例探讨的是如何创建一个既能兼容Firefox又能兼容Internet Explorer的动态表格（Table）...
input 的 oninput onkeypress onkeydown onchange 事件的区别
weixin_30607029的博客
12-20 691
事件执行顺序: <input type="text" id="foo" onkeydown="console.log('down')" onkeypress="console.log('press')" oninput="console.log('input')" onkeyup="console.log('up')" > 以上打印顺序为 'do...
js实现键盘数字输入
weixin_30318645的博客
07-16 801
<html> <head> <meta charset="UTF-8"> </head> <script> function return_value(e){ var e = e || window.event; var charCode=e.keyCode || e.charCode;...
自动填表时如何激活INPUT中的onkeypress事件
weixin_30701521的博客
12-29 138
1解决方案123DimoDocAsHTMLDocument4SetoDoc=pDisp.Document56DimoInputAsHTMLInputElement7SetoInput=oDoc.getElementsByName("user")(0)8oInput.FireEvent"onkeypress"91011解...
输入框只能输入正整数
paj123456789的博客
06-13 501
<input type='text' onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')" onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || /\.\d\d$/.test(value))event.returnV...
el-input限制只能输入数字（开发小记）
Master_Tang的博客
01-05 3713
输入框中限制通常有三种处理方法 第一种：设置type属性（不推荐） 设置type属性为number，text等等，此方法输入框的后面会有不必要样式出现 <el-input type="number"></el-input> 第二种：在属性中添加onkeyup或者oninput进行正则判断 onkeyup，oninput，onchange各有好坏，在这里，推荐onkeyup，在要求不是太高的系统中可以这样使用 <el-input v-model="fo
html输入框验证数字,input框内数字的合法性校验
weixin_42360733的博客
06-04 702
e.target.value=e.target.value.replace(/[^\d.]/g,"");//清除"数字"和"."以外的字符e.target.value=e.target.value.replace(/^\./g,"");//验证第一个字符是数字而不是.e.target.value=e.target.value.replace(/^0([0-9])/g,"$1");...
文本框中onkeypress在火狐无法输入的bug
觉罗晓的博客
02-20 1611
-------文本框调用 onkeypress="return inputNum(event);" ----js function inputNum(evt){       //火狐使用evt.which获取键盘按键值，IE使用window.event.keyCode获取键盘按键值     var ev = evt.which?evt.which:window.event
说说 input 输入框的事件
热门推荐
hrbsfdxzhq01的博客
01-24 1万+
1、从input框获取焦点到，输入值，失去焦点这个过程所有事件，以及一些特点； 过程：onfocus -&gt; 键盘输入 -&gt; onkeydown -&gt; onkeypress -&gt; onkeyup -&gt; oninput -&gt; 失去焦点 -&gt;  onchange -&gt; onblur  注意： onchange 事件并不是每次输入框值改变的时候触发的，而...
input text控件的onkeydown、onKeyPress、onkeyup事件的区别
bjut_yue的专栏
02-19 9804
input text输入框的这三个键盘响应事件看似是差不多的，实际上他们的执行事件还是有区别的，经过了半天的各种尝试（这里实际上就是想做一个能将金钱数额利用js转换成为大写的功能），遇到的问题就是每次都是无法在第一次就获取input的value，一开始被迫使用了onblur和onchange。 但是这样用户体验太差了，所以我就测试题目上三种的不同，首先down这个是按下后就相应了，基本上比较适合
input框只能输入数字的两种方法
vickzhang的专栏
02-07 3780
通过onkeypress事件是输不上任何非数字字符  =48&&event.keyCode<=57"  />  通过onkeyup事件是输上后再去掉非数字字符  <input type="text" onkeyup="value=value.replace(/[^\d]/g,'') "> function check(){var value = document.get
设置el-input只能输入数字
最新发布
11-08
要设置el-input只能输入数字，可以使用以下两种方法之一： 1. 在el-input中添加type="number"属性，这将限制输入框只能输入数字，但是无法排除其他字符如字母和符号。 2. 在el-input中添加onKeypress事件，使用正则表达式来限制输入框只能输入数字。例如：onKeypress="return(/^[0-9]*$/.test(String.fromCharCode(event.keyCode)))"。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值