js限制文本框只能输入整数或者带小数点的数字


Posted in Javascript onApril 27, 2015

做表单验证的时候是否会碰到验证某个输入框内只能填写数字呢,仅允许输入整数数字或者带小数点的数字。下面这段代码也许能帮到你!通过对当前输入框定义onkeypress,onkeyup,onblur事件对表单做了充分的验证,结果还是非常靠谱的。

<input type="text" value="" t_value="" o_value="" onkeypress="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;else this.t_value=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.o_value=this.value" onkeyup="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;else this.t_value=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.o_value=this.value" onblur="if(!this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?|\.\d*?)?$/))this.value=this.o_value;else{if(this.value.match(/^\.\d+$/))this.value=0+this.value;if(this.value.match(/^\.$/))this.value=0;this.o_value=this.value}" />

下面对onkeypress,onkeyup,onblur事件做简要的解释。

onkeypress 事件会在键盘按键被按下并释放一个键时发生。

onkeyup 事件会在键盘按键被松开时发生。

onblur 事件会在对象失去焦点时发生。

另外需要注意的是如果需要做严格验证的表单,一定要客户端和服务器端进行双重验证,以上紧紧做了客户端验证。如果稍微懂点程序的人,能够很轻松的绕过这段验证代码,如果服务器端没有进行验证的话,就很容易出问题的。

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
网页设计常用的一些技巧
Dec 22 Javascript
Uglifyjs(JS代码优化工具)入门 安装使用
Apr 13 Javascript
jQuery取id有.的值的方法
May 21 Javascript
详谈$.data()的用法和作用
Feb 13 Javascript
微信小程序 下拉菜单的实现
Apr 06 Javascript
详解React中的组件通信问题
Jul 31 Javascript
weex slider实现滑动底部导航功能
Aug 28 Javascript
ionic2懒加载配置详解
Sep 01 Javascript
JS实现自定义状态栏动画文字效果示例
Oct 12 Javascript
vue.js项目打包上线的图文教程
Nov 16 Javascript
基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果
Jan 09 Javascript
Smartour 让网页导览变得更简单(推荐)
Jul 19 Javascript
如何使用HTML5地理位置定位功能
Apr 27 #Javascript
jQuery插件scroll实现无缝滚动效果
Apr 27 #Javascript
Javascript非构造函数的继承
Apr 27 #Javascript
JQuery选中checkbox方法代码实例(全选、反选、全不选)
Apr 27 #Javascript
jquery简单的弹出层浮动层代码
Apr 27 #Javascript
javascript实现俄罗斯方块游戏的思路和方法
Apr 27 #Javascript
JQuery记住用户名密码实现下次自动登录功能
Apr 27 #Javascript
You might like
SONY ICF-SW07收音机电路分析
2021/03/02 无线电
社区(php&amp;&amp;mysql)一
2006/10/09 PHP
Ajax和PHP正则表达式验证表单及验证码
2016/09/24 PHP
JavaScript入门教程(7) History历史对象
2009/01/31 Javascript
JQuery 获得绝对,相对位置的坐标方法
2010/02/09 Javascript
IE的有条件注释判定IE版本详解(附实例代码)
2012/01/04 Javascript
jquery 实现密码框的显示与隐藏示例代码
2013/09/18 Javascript
使用JSLint提高JS代码质量方法分享
2013/12/16 Javascript
jQuery实现鼠标滑向当前图片高亮显示并且其它图片变灰的方法
2015/07/27 Javascript
js实现C#的StringBuilder效果完整实例
2015/12/22 Javascript
纯JS实现可拖拽表单的简单实例
2016/09/02 Javascript
JavaScript对象创建模式实例汇总
2016/10/03 Javascript
el-table表头根据内容自适应完美解决表头错位和固定列错位
2021/01/07 Javascript
手动实现vue2.0的双向数据绑定原理详解
2021/02/06 Vue.js
python通过索引遍历列表的方法
2015/05/04 Python
Python探索之SocketServer详解
2017/10/28 Python
浅谈使用Python变量时要避免的3个错误
2017/10/30 Python
python 实现对数据集的归一化的方法(0-1之间)
2018/07/17 Python
python 地图经纬度转换、纠偏的实例代码
2018/08/06 Python
详解pyenv下使用python matplotlib模块的问题解决
2018/11/29 Python
Python3.7实现验证码登录方式代码实例
2020/02/14 Python
python实现根据给定坐标点生成多边形mask的例子
2020/02/18 Python
Python实现电视里的5毛特效实例代码详解
2020/05/15 Python
如何教少儿学习Python编程
2020/07/10 Python
python利用faker库批量生成测试数据
2020/10/15 Python
Python logging自定义字段输出及打印颜色
2020/11/30 Python
Opencv+Python识别PCB板图片的步骤
2021/01/07 Python
CSS3制作ajax loader icon实现思路及代码
2013/08/25 HTML / CSS
一张图片能隐含千言万语之隐藏你的程序代码
2012/12/13 HTML / CSS
如果一个类实现了多个接口但是这些接口有相同的方法名将会怎样
2013/06/16 面试题
黄河象教学反思
2014/02/10 职场文书
高考标语大全
2014/06/05 职场文书
2014乡镇干部纪律作风整顿思想汇报
2014/09/13 职场文书
践行党的群众路线心得体会
2014/11/05 职场文书
Golang标准库syscall详解(什么是系统调用)
2021/05/25 Golang
MongoDB误操作后使用oplog恢复数据
2022/04/11 MongoDB