限制只能输入数字的实现代码


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);
}

以上这篇限制只能输入数字的实现代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript中定义私有方法说明(private method)
Jan 27 Javascript
深入理解JavaScript系列(40):设计模式之组合模式详解
Mar 04 Javascript
js脚本分页代码分享(7种样式)
Aug 19 Javascript
基于jquery插件实现拖拽删除图片功能
Aug 27 Javascript
浅谈react.js 之 批量添加与删除功能
Apr 17 Javascript
js插件实现图片滑动验证码
Sep 29 Javascript
微信小程序用户自定义模版用法实例分析
Nov 28 Javascript
使用vue脚手架(vue-cli)搭建一个项目详解
May 09 Javascript
vue中使用GraphQL的实例代码
Nov 04 Javascript
vue中英文切换实例代码
Jan 21 Javascript
微信小程序文章列表功能完整实例
Jun 03 Javascript
TypeScript 运行时类型检查补充工具
Sep 28 Javascript
JavaScript开发Chrome浏览器扩展程序UI的教程
May 16 #Javascript
基于javascript实现最简单的选项卡切换效果
May 16 #Javascript
JavaScript实现页面跳转的方式汇总
May 16 #Javascript
js实现页面跳转的几种方法小结
May 16 #Javascript
WebApi+Bootstrap+KnockoutJs打造单页面程序
May 16 #Javascript
KnockoutJs快速入门教程
May 16 #Javascript
JS学习之表格的排序简单实例
May 16 #Javascript
You might like
PHP 面向对象 final类与final方法
2010/05/05 PHP
PHP中file_get_contents高?用法实例
2014/09/24 PHP
JQuery FlexiGrid的asp.net完美解决方案 dotNetFlexGrid-.Net原生的异步表格控件
2010/09/12 Javascript
JS函数实现动态添加CSS样式表文件
2012/12/15 Javascript
JS localStorage实现本地缓存的方法
2013/06/22 Javascript
使用jQuery将多条数据插入模态框的实现代码
2014/10/08 Javascript
详解JavaScript中的自定义事件编写
2016/05/10 Javascript
引用jquery框架后出错的解决方法
2016/08/09 Javascript
JavaScript 函数节流详解及方法总结
2017/02/09 Javascript
AngularJS的Filter的示例详解
2017/03/07 Javascript
微信小程序录音与播放录音功能
2017/12/25 Javascript
Vue用v-for给src属性赋值的方法
2018/03/03 Javascript
原生js实现拖拽功能基本思路详解
2018/04/18 Javascript
微信小程序多音频播放进度条问题
2018/08/28 Javascript
JavaScript面向对象程序设计中对象的定义和继承详解
2019/07/29 Javascript
Vue项目配置跨域访问和代理proxy设置方式
2020/09/08 Javascript
python查找指定具有相同内容文件的方法
2015/06/28 Python
Python编程pygame模块实现移动的小车示例代码
2018/01/03 Python
对python判断ip是否可达的实例详解
2019/01/31 Python
python使用wxpy实现微信消息防撤回脚本
2019/04/29 Python
Python简单处理坐标排序问题示例
2019/07/11 Python
导致python中import错误的原因是什么
2020/07/01 Python
python设置中文界面实例方法
2020/10/27 Python
UI自动化定位常用实现方法代码示例
2020/10/27 Python
python中添加模块导入路径的方法
2021/02/03 Python
理肤泉美国官网:La Roche-Posay
2018/01/17 全球购物
美国CVS药店官网:CVS Pharmacy
2018/07/26 全球购物
汽车技术服务英文求职信范文
2014/01/02 职场文书
商业活动邀请函
2014/02/04 职场文书
党风廉政承诺书
2014/03/27 职场文书
父母对孩子的寄语
2014/04/09 职场文书
四查四看整改措施
2014/09/19 职场文书
法律进社区活动总结
2015/05/07 职场文书
致接力运动员加油稿
2015/07/21 职场文书
如何把新闻人物写得立体、鲜活?
2019/08/14 职场文书
springboot入门 之profile设置方式
2022/04/04 Java/Android