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


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 相关文章推荐
传递参数的标准方法(jQuery.ajax)
Nov 19 Javascript
IE和Firefox下javascript的兼容写法小结
Dec 10 Javascript
使用AngularJS和PHP的Laravel实现单页评论的方法
Jun 19 Javascript
jquery+ajax实现注册实时验证实例详解
Dec 08 Javascript
js中最容易被忽视的事件问题大总结
May 15 Javascript
15个值得开发人员关注的jQuery开发技巧和心得总结【经典收藏】
May 25 Javascript
javascript入门之数组[新手必看]
Nov 21 Javascript
详解ES6之async+await 同步/异步方案
Sep 19 Javascript
javascript 中模板方法单例的实现方法
Oct 17 Javascript
实现单层json按照key字母顺序排序的示例
Dec 06 Javascript
微信小程序实现评论功能
Nov 28 Javascript
JavaScript数组排序小程序实现解析
Jan 13 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
慎用preg_replace危险的/e修饰符(一句话后门常用)
2013/06/19 PHP
php分页函数完整实例代码
2014/09/22 PHP
php制作的简单验证码识别代码
2016/01/26 PHP
Zend Framework实现自定义过滤器的方法
2016/12/09 PHP
php二维码生成以及下载实现
2017/09/28 PHP
浅谈Laravel POST,PUT,PATCH 路由的区别
2019/10/15 PHP
javascript 模拟JQuery的Ready方法实现并出现的问题
2009/12/06 Javascript
动态加载script文件的两种方法
2013/08/15 Javascript
Nodejs中调用系统命令、Shell脚本和Python脚本的方法和实例
2015/01/01 NodeJs
Angularjs 滚动加载更多数据
2016/03/17 Javascript
javascript深拷贝(deepClone)详解
2016/08/24 Javascript
浅谈Vue SSR 的 Cookies 问题
2017/11/20 Javascript
JS正则表达式常见用法实例详解
2018/06/19 Javascript
微信小程序自定义键盘 内部虚拟支付
2018/12/20 Javascript
JavaScript两种计时器的实例讲解
2019/01/31 Javascript
Angular 中使用 FineReport不显示报表直接打印预览
2019/08/21 Javascript
vue-openlayers实现地图坐标弹框效果
2020/09/24 Javascript
[58:57]2018DOTA2亚洲邀请赛3月29日小组赛B组 Effect VS VGJ.T
2018/03/30 DOTA
python使用cStringIO实现临时内存文件访问的方法
2015/03/26 Python
用Python实现一个简单的多线程TCP服务器的教程
2015/05/05 Python
Python中的hypot()方法使用简介
2015/05/18 Python
python在ubuntu中的几种安装方法(小结)
2017/12/08 Python
python+matplotlib绘制饼图散点图实例代码
2018/01/20 Python
Python爬虫获取页面所有URL链接过程详解
2020/06/04 Python
美国顶级水上运动专业店:Marine Products
2018/04/15 全球购物
什么是静态路由,其特点是什么?什么是动态路由,其特点是什么?
2013/07/26 面试题
服装公司总经理岗位职责
2013/11/30 职场文书
酒店个人求职信范文
2014/01/25 职场文书
改革共识倡议书
2014/08/29 职场文书
2014领导班子“四风问题”对照检查材料思想汇报(执法局)
2014/09/21 职场文书
公司合作协议范文
2014/10/01 职场文书
委托书格式要求
2015/01/28 职场文书
2016重阳节红领巾广播稿
2015/12/18 职场文书
python opencv人脸识别考勤系统的完整源码
2021/04/26 Python
Golang 获取文件md5校验的方法以及效率对比
2021/05/08 Golang
Python-typing: 类型标注与支持 Any类型详解
2021/05/10 Python