js限制文本框只能输入数字方法小结


Posted in Javascript onJune 16, 2014

有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数字、小数点、英文字母、汉字等代码。

例如,输入大于0的正整数

<input onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}">

1,文本框只能输入数字代码(小数点也不能输入)

<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">

2,只能输入数字,能输小数点. IE only

<input onkeyup="if(isNaN(value))execCommand('undo')" onafterpaste="if(isNaN(value))execCommand('undo')">
<input name=txt1 onchange="if(/\D/.test(this.value)){alert('只能输入数字');this.value='';}">

3,数字和小数点方法二

<input type=text 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}">

封装成单独的函数: 

function keyPress(ob) {
 if (!ob.value.match(/^[\+\-]?\d*?\.?\d*?$/)) ob.value = ob.t_value; else ob.t_value = ob.value; if (ob.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/)) ob.o_value = ob.value;
}
function keyUp(ob) {
 if (!ob.value.match(/^[\+\-]?\d*?\.?\d*?$/)) ob.value = ob.t_value; else ob.t_value = ob.value; if (ob.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/)) ob.o_value = ob.value;
    }
function onBlur(ob) {
if(!ob.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?|\.\d*?)?$/))ob.value=ob.o_value;else{if(ob.value.match(/^\.\d+$/))ob.value=0+ob.value;if(ob.value.match(/^\.$/))ob.value=0;ob.o_value=ob.value};
}

只需在调用,传入this对象即可!

4,只能输入字母和汉字

<input onkeyup="value=value.replace(/[\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[\d]/g,''))" maxlength=10 name="Numbers">

5,只能输入英文字母和数字,不能输入中文

<input onkeyup="value=value.replace(/[^\w\.\/]/ig,'')">

6,只能输入数字和英文

<input onKeyUp="value=value.replace(/[^\d|chun]/g,'')">

7,小数点后只能有最多两位(数字,中文都可输入),不能输入字母和运算符号:

<input onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || /\.\d\d$/.test(value))event.returnValue=false">

8,小数点后只能有最多两位(数字,字母,中文都可输入),可以输入运算符号:

<input onkeyup="this.value=this.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')">

这篇文章就介绍到这了,需要的朋友可以参考一下

Javascript 相关文章推荐
js 禁用浏览器的后退功能的简单方法
Dec 10 Javascript
JQuery 插件模板 制作jquery插件的朋友可以参考下
Mar 17 Javascript
JS代码放在head和body中的区别分析
Dec 01 Javascript
JavaScript中的this关键字使用详解
Aug 14 Javascript
JavaScript子窗口调用父窗口变量和函数的方法
Oct 09 Javascript
react.js使用webpack搭配环境的入门教程
Aug 14 Javascript
前端跨域的几种解决方式总结(推荐)
Aug 16 Javascript
浅谈angular4 ng-content 中隐藏的内容
Aug 18 Javascript
浅谈js获取ModelAndView值的问题
Mar 28 Javascript
jQuery插件jsonview展示json数据
May 26 jQuery
vue + typescript + 极验登录验证的实现方法
Jun 27 Javascript
vue全屏事件开发详解
Jun 17 Javascript
JS实现简单的顶部定时关闭层效果
Jun 15 #Javascript
jQuery中的height innerHeight outerHeight区别示例介绍
Jun 15 #Javascript
鼠标移到图片上变大显示而不是放大镜效果
Jun 15 #Javascript
js中的如何定位固定层的位置
Jun 15 #Javascript
Extjs Label的 fieldLabel和html属性值对齐的方法
Jun 15 #Javascript
jquery实现通用版鼠标经过淡入淡出效果
Jun 15 #Javascript
jQuery实现的原图对比窗帘效果
Jun 15 #Javascript
You might like
PHP file_get_contents 函数超时的几种解决方法
2009/07/30 PHP
PHP MVC模式在网站架构中的实现分析
2010/03/04 PHP
PHP中使用crypt()实现用户身份验证的代码
2012/09/05 PHP
thinkphp3.x中变量的获取和过滤方法详解
2016/05/20 PHP
基于jquery的模态div层弹出效果
2010/08/21 Javascript
javascript五图轮播切换实用版
2012/08/17 Javascript
Jquery UI震动效果实现原理及步骤
2013/02/04 Javascript
ajax如何实现页面局部跳转与结果返回
2015/08/24 Javascript
基于javascript实现泡泡大冒险网页版小游戏
2016/03/23 Javascript
nodejs个人博客开发第五步 分配数据
2017/04/12 NodeJs
微信小程序获取微信运动步数的实例代码
2017/07/20 Javascript
jQueryUI Sortable 应用Demo(分享)
2017/09/07 jQuery
mui框架 页面无法滚动的解决方法(推荐)
2018/01/25 Javascript
JavaScript实现获取select下拉框中第一个值的方法
2018/02/06 Javascript
JavaScript实现区块链
2018/03/14 Javascript
JavaScript递归函数定义与用法实例分析
2019/01/24 Javascript
原生js实现商品筛选功能
2019/10/28 Javascript
VUE 单页面使用 echart 窗口变化时的用法
2020/07/30 Javascript
Webpack3+React16代码分割的实现
2021/03/03 Javascript
[14:00]DOTA2国际邀请赛史上最长大战 赛后专访B神
2013/08/10 DOTA
python 中split 和 strip的实例详解
2017/07/12 Python
新手如何发布Python项目开源包过程详解
2019/07/11 Python
python如何调用java类
2020/07/05 Python
学会迭代器设计模式,帮你大幅提升python性能
2021/01/03 Python
基于tensorflow __init__、build 和call的使用小结
2021/02/26 Python
adidas美国官网:adidas US
2016/09/21 全球购物
英国领先的在线高尔夫商店:Scottsdale Golf
2019/08/26 全球购物
Deux par Deux官方网站:设计师童装
2020/01/03 全球购物
雅虎笔试题(字符串操作)
2015/03/24 面试题
举例说明类变量和实例变量的区别
2016/06/30 面试题
新闻专业应届生求职信
2013/10/31 职场文书
计算机软件专业求职信
2014/06/10 职场文书
教师作风整改措施思想汇报
2014/10/12 职场文书
优秀班组申报材料
2014/12/25 职场文书
同学聚会邀请函
2015/01/30 职场文书
正则表达式拆分url实例代码
2022/02/24 Java/Android