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 相关文章推荐
判断JavaScript对象是否可用的最正确方法分析
Oct 03 Javascript
jQuery 事件队列调整方法
Sep 18 Javascript
jQuery 处理网页内容的实现代码
Feb 15 Javascript
鼠标焦点离开文本框时验证的js代码
Jul 19 Javascript
js判断undefined类型,undefined,null, 的区别详细解析
Dec 16 Javascript
改变状态栏文字的js代码
Jun 13 Javascript
JavaScript中实现Map的示例代码
Sep 09 Javascript
Bootstrap标签页(Tab)插件切换echarts不显示问题的解决
Jul 13 Javascript
详解微信小程序回到顶部的两种方式
May 09 Javascript
vue.js自定义组件实现v-model双向数据绑定的示例代码
Jan 08 Javascript
Vue中多元素过渡特效的解决方案
Feb 05 Javascript
Javascript表单序列化原理及实现代码详解
Oct 30 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
Php图像处理类代码分享
2012/01/19 PHP
php+js实现异步图片上传实例分享
2014/06/02 PHP
PHP制作万年历
2015/01/07 PHP
PHP工程师VIM配置分享
2015/12/15 PHP
jQuery autocomplete插件修改
2009/04/17 Javascript
jQuery fadeTo方法调整图片的透明度使用介绍
2013/05/06 Javascript
eclipse导入jquery包后报错的解决方法
2014/02/17 Javascript
Node.js入门教程:在windows和Linux上安装配置Node.js图文教程
2014/08/14 Javascript
jquery点击缩略图切换视频播放特效代码分享
2015/09/15 Javascript
JavaScript实现上下浮动的窗口效果代码
2015/10/12 Javascript
JavaScript实现垂直向上无缝滚动特效代码
2016/11/23 Javascript
ReactJs快速入门教程(精华版)
2016/11/28 Javascript
bootstrap组件之导航组件使用方法
2017/01/19 Javascript
canvas时钟效果
2017/02/16 Javascript
two.js之实现动画效果示例
2017/11/06 Javascript
详解Vue-cli webpack移动端自动化构建rem问题
2018/04/07 Javascript
通过vue-router懒加载解决首次加载时资源过多导致的速度缓慢问题
2018/04/08 Javascript
Vue.js递归组件实现组织架构树和选人功能
2019/07/04 Javascript
vue+element实现图片上传及裁剪功能
2020/06/29 Javascript
JS代码简洁方式之函数方法详解
2020/07/28 Javascript
多种类型jQuery网页验证码插件代码实例
2021/01/09 jQuery
[02:35]DOTA2超级联赛专访XB 难忘一年九冠称王
2013/06/20 DOTA
Python设计模式之命令模式简单示例
2018/01/10 Python
解决pyttsx3无法封装的问题
2018/12/24 Python
Python Pandas 箱线图的实现
2019/07/23 Python
python3连接kafka模块pykafka生产者简单封装代码
2019/12/23 Python
使用python实现飞机大战游戏
2020/03/23 Python
Python实现代码块儿折叠
2020/04/15 Python
详解用Python调用百度地图正/逆地理编码API
2020/07/02 Python
css3 边框、背景、文本效果的实现代码
2018/03/21 HTML / CSS
Erwin Müller穆勒家居瑞士官网:您整个家庭的邮购公司
2019/12/28 全球购物
电子商务专业毕业生求职信
2014/06/12 职场文书
门卫岗位职责说明书
2014/08/18 职场文书
酒店人事专员岗位职责
2015/04/07 职场文书
Nginx配置https原理及实现过程详解
2021/03/31 Servers
使用SQL实现车流量的计算的示例代码
2022/02/28 SQL Server