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 相关文章推荐
jQuery-serialize()输出序列化form表单值的方法
Dec 26 Javascript
Javascript实现滚动图片新闻的实例代码
Nov 27 Javascript
JQuery表格拖动调整列宽效果(自己动手写的)
Sep 01 Javascript
node.js中RPC(远程过程调用)的实现原理介绍
Dec 05 Javascript
javascript实现下拉提示选择框
Dec 29 Javascript
js滑动提示效果代码分享
Mar 10 Javascript
JS实现点击登录弹出窗口同时背景色渐变动画效果
Mar 25 Javascript
JavaScript和jquery获取父级元素、子级元素、兄弟元素的方法
Jun 05 Javascript
原生js简单实现放大镜特效
May 16 Javascript
React-Native做一个文本输入框组件的实现代码
Aug 10 Javascript
javascript数组去重方法总结(推荐)
Mar 20 Javascript
node.js中 mysql 增删改查操作及async,await处理实例分析
Feb 11 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
Protoss建筑一览
2020/03/14 星际争霸
MYSQL环境变量设置方法
2007/01/15 PHP
php 获取完整url地址
2008/12/20 PHP
PHP 加密/解密函数 dencrypt(动态密文,带压缩功能,支持中文)
2009/01/30 PHP
PHP下的浮点运算不准的解决方法
2016/10/27 PHP
PHP面相对象中的重载与重写
2017/02/13 PHP
PHP实现cookie跨域session共享的方法分析
2019/08/23 PHP
Thinkphp5框架ajax接口实现方法分析
2019/08/28 PHP
PHP日期和时间函数的使用示例详解
2020/08/06 PHP
Js中setTimeout()和setInterval() 何时被调用执行的用法
2013/04/12 Javascript
将nodejs打包工具整合到鼠标右键的方法
2013/05/11 NodeJs
JS实现定时页面弹出类似QQ新闻的提示框
2013/11/07 Javascript
js jquery ajax的几种用法总结(及优缺点介绍)
2014/01/28 Javascript
js获取IP地址的方法小结
2014/07/01 Javascript
IE6 hack for js 集锦
2014/09/23 Javascript
javascript继承机制实例详解
2014/11/20 Javascript
NodeJS Web应用监听sock文件实例
2015/02/18 NodeJs
js时钟翻牌效果实现代码分享
2020/07/31 Javascript
AngularJS入门教程之REST和定制服务详解
2016/08/19 Javascript
一个Js文件函数中调用另一个Js文件函数的方法演示
2017/08/14 Javascript
VueJs 将接口用webpack代理到本地的方法
2017/11/27 Javascript
python3实现暴力穷举博客园密码
2016/06/19 Python
Python获取系统所有进程PID及进程名称的方法示例
2018/05/24 Python
python事件驱动event实现详解
2018/11/21 Python
Python用Jira库来操作Jira
2020/12/28 Python
澳大利亚最大的网上油画销售画廊:Direct Art Australia
2018/04/15 全球购物
英国在线药房和在线医生:LloydsPharmacy
2019/10/21 全球购物
部门年终奖分配方案
2014/05/07 职场文书
小区推广策划方案
2014/06/06 职场文书
2014党的群众路线教育实践活动总结报告
2014/10/31 职场文书
申报优秀教师材料
2014/12/16 职场文书
幼儿教师2014年度工作总结
2014/12/16 职场文书
优秀班组事迹材料
2014/12/24 职场文书
春秋淹城导游词
2015/02/11 职场文书
JS 基本概念详细介绍
2021/10/16 Javascript
Ruby使用Mysql2连接操作MySQL
2022/04/19 Ruby