怎么限制input的text里输入的值只能是数字(正则、js)


Posted in Javascript onMay 16, 2016

当我们在一些网站注册账号、填写信息是,不小心将电话号码填写成汉字或其他英文字母了,这显然是不正确的。为了帮助用户更好地纠正输入时的错误,在表单中填写信息时,需要限制手机号、邮编、电话号码这类文本框不能输入其他字符,只能是数字。

通过使用正则匹配输入的时候只是数字:

var numRegex = /\D/g

再通过JavaScript的onblur 事件:

定义和用法

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

Onblur 经常用于Javascript验证代码,一般用于表单输入框

语法

HTML 中:

<element onblur="SomeJavaScriptCode">

JavaScript 中:

object.onblur= function(){
//操作
myScript; 
}

JavaScript 中, 使用 addEventListener() 方法:

 

object.addEventListener('blur',myScript);

最终DEMO代码:

var numRegexFn = function(obj){
obj.value = obj.value.replace(numRegex,'');
if(!obj.value){
alert('请输入数字');
}else{
alert('pass');
}
}
phone.onblur = function(){
numRegexFn(this);
}

以上所述是小编给大家介绍的使用正则表达式和js限制只能输入数字的相关内容,希望对大家有所帮助,也希望大家多多的关注三水点靠木网站!

Javascript 相关文章推荐
用js判断用户浏览器是否是XP SP2的IE6
Mar 08 Javascript
Javascript生成json的函数代码(可以用php的json_decode解码)
Jun 11 Javascript
网页打开自动最大化的js代码
Aug 22 Javascript
IE下window.onresize 多次调用与死循环bug处理方法介绍
Nov 12 Javascript
jQuery知识点整理
Jan 30 Javascript
javascript中使用正则表达式清理table样式的代码
Apr 01 Javascript
浅谈JS的基础类型与引用类型
Sep 13 Javascript
Vue.js快速入门实例教程
Oct 15 Javascript
Angular 4依赖注入学习教程之ValueProvider的使用(七)
Jun 04 Javascript
基于react组件之间的参数传递(详解)
Sep 05 Javascript
深入理解vue中slot与slot-scope的具体使用
Jan 26 Javascript
uni-app微信小程序登录并使用vuex存储登录状态的思路详解
Nov 04 Javascript
BootStrap点击下拉菜单项后显示一个新的输入框实现代码
May 16 #Javascript
在javascript中创建对象的各种模式解析
May 16 #Javascript
Bootstrap3 input输入框插入glyphicon图标的方法
May 16 #Javascript
论Bootstrap3和Foundation5网格系统的异同
May 16 #Javascript
Javascript基础教程之比较null和undefined值
May 16 #Javascript
javascript对象的相关操作小结
May 16 #Javascript
WEB前端开发框架Bootstrap3 VS Foundation5
May 16 #Javascript
You might like
模板引擎Smarty深入浅出介绍
2006/12/06 PHP
关于BIG5-HKSCS的解决方法
2007/03/20 PHP
jq的get传参数在utf-8中乱码问题的解决php版
2008/07/23 PHP
php下实现在指定目录搜索指定类型文件的函数
2008/10/03 PHP
Laravel网站打开速度优化的方法汇总
2017/07/16 PHP
PHP实现的字符串匹配算法示例【sunday算法】
2017/12/19 PHP
关于捕获用户何时点击window.onbeforeunload的取消事件
2011/03/06 Javascript
在iframe里的页面编写js,实现在父窗口上创建动画效果展开和收缩的div(不变动iframe父窗口代码)
2011/12/20 Javascript
一个JavaScript变量声明的知识点
2013/10/28 Javascript
JavaScript监听文本框回车事件并过滤文本框空格的方法
2015/04/16 Javascript
jQuery validate插件实现ajax验证重复的2种方法
2016/01/22 Javascript
js实现人民币大写金额形式转换
2016/04/27 Javascript
jQuery AJAX timeout 超时问题详解
2016/06/21 Javascript
Javascript 基础---Ajax入门必看
2016/07/06 Javascript
bootstrap可编辑下拉框jquery.editable-select
2017/10/12 jQuery
jquery select插件异步实时搜索实例代码
2017/10/20 jQuery
ES6知识点整理之函数数组参数的默认值及其解构应用示例
2019/04/17 Javascript
JQuery+Bootstrap 自定义全屏Loading插件的示例demo
2019/07/03 jQuery
Javascript Symbol原理及使用方法解析
2020/10/22 Javascript
如何利用nodejs自动定时发送邮件提醒(超实用)
2020/12/01 NodeJs
Python编程实现的简单Web服务器示例
2017/06/22 Python
python 缺失值处理的方法(Imputation)
2019/07/02 Python
Python坐标轴操作及设置代码实例
2020/06/04 Python
用python爬虫批量下载pdf的实现
2020/12/01 Python
欧洲著名的珠宝和手表网上商城:uhrcenter
2017/04/10 全球购物
在C语言中实现抽象数据类型什么方法最好
2014/06/26 面试题
项目专员岗位职责
2013/12/04 职场文书
工业设计专业个人求职信范文
2013/12/28 职场文书
日语专业个人求职信范文
2014/02/02 职场文书
办公室主任岗位承诺书
2014/05/29 职场文书
幼儿园教师求职信
2015/03/20 职场文书
2015年十一国庆节演讲稿
2015/03/20 职场文书
污水处理保证书
2015/05/09 职场文书
解决Git推送错误non-fast-forward的方法
2022/06/25 Servers
Apache Kafka 分区重分配的实现原理解析
2022/07/15 Servers
PostgreSQL之连接失败的问题及解决
2023/05/08 PostgreSQL