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一句话全选/取消全选
Mar 01 Javascript
jQuery仿Excel表格编辑功能的实现代码
May 01 Javascript
兼容FF和IE的动态table示例自写
Oct 21 Javascript
jQuery基础语法实例入门
Dec 23 Javascript
jquery实现的蓝色二级导航条效果代码
Aug 24 Javascript
JSONP原理及简单实现
Jun 08 Javascript
js实现微博发布小功能
Jan 12 Javascript
React学习笔记之事件处理(二)
Jul 02 Javascript
Vue实现点击时间获取时间段查询功能
Aug 21 Javascript
jQuery实现获取选中复选框的值实例详解
Jun 28 jQuery
小程序实现发表评论功能
Jul 06 Javascript
详解vue-router 动态路由下子页面多页共活的解决方案
Dec 22 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数组排序函数合集 以及它们之间的联系分析
2013/06/27 PHP
php构造函数的继承方法
2015/02/09 PHP
JavaScript去除空格的几种方法
2006/10/03 Javascript
Google Suggest ;-) 基于js的动态下拉菜单
2006/10/11 Javascript
再谈javascript面向对象编程
2012/03/18 Javascript
js函数调用的方式
2014/05/06 Javascript
每天一篇javascript学习小结(RegExp对象)
2015/11/17 Javascript
基于Javascript实现返回顶部按钮
2016/02/29 Javascript
JavaScript学习笔记整理_关于表达式和语句
2016/09/19 Javascript
jQuery实现圣诞节礼物动画案例解析
2016/12/25 Javascript
js replace()去除代码中空格的实例
2017/02/14 Javascript
JS实现浏览上传文件的代码
2017/08/23 Javascript
Windows下使用Nodejs运行js的方法
2017/09/02 NodeJs
Vue.js项目中管理每个页面的头部标签的两种方法
2018/06/25 Javascript
微信小程序实现的图片保存功能示例
2019/04/24 Javascript
JS正则表达式验证密码强度
2020/03/18 Javascript
浏览器JavaScript调试功能无法使用解决方案
2020/09/18 Javascript
在JavaScript中查找字符串中最长单词的三种方法(推荐)
2021/01/18 Javascript
Vue单页面应用中实现Markdown渲染
2021/02/14 Vue.js
[03:46]DAC趣味视频-中文考试.mp4
2017/04/02 DOTA
python 读取excel文件生成sql文件实例详解
2017/05/12 Python
Tensorflow的常用矩阵生成方式
2020/01/04 Python
Python 随机生成测试数据的模块:faker基本使用方法详解
2020/04/09 Python
keras-siamese用自己的数据集实现详解
2020/06/10 Python
美特斯邦威官方商城:邦购网
2016/10/13 全球购物
美国亚马逊旗下时尚女装网店:SHOPBOP(支持中文)
2020/10/17 全球购物
开放系统互连参考模型
2016/06/29 面试题
心理学专业毕业生推荐信范文
2013/11/21 职场文书
仓库理货员岗位职责
2013/12/18 职场文书
监理资料员岗位职责
2014/01/03 职场文书
婚礼新郎父母答谢词
2014/01/16 职场文书
课外科技活动总结
2014/08/27 职场文书
公司财务部岗位职责
2015/04/14 职场文书
MySQL pt-slave-restart工具的使用简介
2021/04/07 MySQL
python小程序之飘落的银杏
2021/04/17 Python
Spring中bean集合注入的方法详解
2022/07/07 Java/Android