JavaScript通过RegExp实现客户端验证处理程序


Posted in Javascript onMay 07, 2013

1.让文本框只允许输入数字,运用asp.net mvc3.0的文本框控件

@Html.TextBox("txt",null, new {@style="width:300;",onkeypress="return RegValidateIsDigit(event)" })

可以看到在文本框中注册了onkeypress事件,当在文本框中输入一个字符按下键盘的时候就会触发该JavaScript的函数
<script type="text/javascript"> 
function RegValidateIsDigit(e) { 
var KeyChar; 
debugger; 
////判断浏览器 
if (window.event) //IE 
{ 
KeyChar = e.keyCode; 
} 
else if (e.which)///FireFox等 
{ 
KeyChar = e.which; 
} 
var str = String.fromCharCode(KeyChar); ///通过UniCode编码来来查找相应的字符 
return regIsDigit(str); 
} 
function regIsDigit(fData) { 
///定义正则进行匹配 
var reg = new RegExp("^[0-9]$"); 
return (reg.test(fData)); 
} 
</script>

首先判断一下浏览器,进行处理兼容性。然后通过String.formCharCode(KeyChar)来查找相应的字符
最后在函数regIsDigit函数中
定义正则进行匹配
var reg = new RegExp("^[0-9]$");

因为是数值0-9所以也等同于\d即
var reg = new RegExp("\\d$");

正则表达式直接量也被定义为包含在一对斜杠(/)之间的字符.所以,JavaScript可能会包含如下的代码:
var reg=/\d$/;

这里还用到了test函数: 检查指定的字符串是否存在。常用的还有exec match search replace split等函数。
如果搞懂了第一个那么只需要套用正则就可以使用了哦。
2.文本框只允许输入中文
function RegValidateIsChinese(str) { 
//var reg = new RegExp("^[\u4e00-\u9fa5]+$"); 
var reg = /^[\u4E00-\u9FA5]+$/; 
var str=document.getElementById("text").value; 
return (reg.test(str)); 
}

RegValidateIsChinese("输入的字符串") 是汉字则返回true,不全是汉字则返回false
3.邮箱输入格式的判断
function RegValidateIsEmail(str) { 
//var reg = /^([a-zA-Z0-9_-])+@@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/; 
var reg=/^\w+((-\w+)|(\.\w+))*@@{1}\w+\.{1}\w{2,4}(\.{0,1}\w{2}){0,1}/ig; 
if (reg.test(str)) { 
alert("是邮箱"); 
} 
else { 
alert("格式不对"); 
} 
}

两个定义初步测试都可以。
Javascript 相关文章推荐
javascript js cookie的存储,获取和删除
Dec 29 Javascript
基于jquery的一个OutlookBar类,动态创建导航条
Nov 19 Javascript
情人节之礼 js项链效果
Feb 13 Javascript
使用AngularJS 应用访问 Android 手机的图片库
Mar 24 Javascript
JavaScript各类型的关系图解
Oct 16 Javascript
Angular 应用技巧总结
Sep 14 Javascript
React学习笔记之列表渲染示例详解
Aug 22 Javascript
详解基于Vue2.0实现的移动端弹窗(Alert, Confirm, Toast)组件
Aug 02 Javascript
js取0-9随机取4个数不重复的数字代码实例
Mar 27 Javascript
vue使用原生swiper代码实例
Feb 05 Javascript
使用Vue-scroller页面input框不能触发滑动的问题及解决方法
Aug 08 Javascript
vue3.0生命周期的示例代码
Sep 24 Javascript
JS注册/移除事件处理程序(ExtJS应用程序设计实战)
May 07 #Javascript
使用Math.floor与Math.random取随机整数的方法详解
May 07 #Javascript
基于JavaScript 类的使用详解
May 07 #Javascript
解读JavaScript中 For, While与递归的用法
May 07 #Javascript
JS Pro-深入面向对象的程序设计之继承的详解
May 07 #Javascript
基于JavaScript实现继承机制之原型链(prototype chaining)的详解
May 07 #Javascript
基于JavaScript实现继承机制之构造函数+原型链混合方式的使用详解
May 07 #Javascript
You might like
PHP速成大法
2015/01/30 PHP
thinkPHP实现的省市区三级联动功能示例
2017/05/05 PHP
PHPUnit测试私有属性和方法功能示例
2018/06/12 PHP
php 将json格式数据转换成数组的方法
2018/08/21 PHP
类之Prototype.js学习
2007/06/13 Javascript
javascript当中的代码嗅探扩展原生对象和原型(prototype)
2013/01/11 Javascript
javascript解决IE6下hover问题的方法
2015/07/28 Javascript
jquery常用函数与方法汇总
2015/09/01 Javascript
JavaScript实现输入框(密码框)出现提示语
2016/01/12 Javascript
BootStrap日期控件在模态框中选择时间下拉菜单无效的原因及解决办法(火狐下不能点击)
2016/08/18 Javascript
JS创建对象的写法示例
2016/11/04 Javascript
Bootstrap导航条鼠标悬停下拉菜单
2017/01/04 Javascript
JavaScript中日常收集常见的10种错误(推荐)
2017/01/08 Javascript
AngularJS实现页面定时刷新
2017/03/14 Javascript
关于jquery layui弹出层的使用方法
2018/04/21 jQuery
vue cli4下环境变量和模式示例详解
2020/04/09 Javascript
Js和VUE实现跑马灯效果
2020/05/25 Javascript
jQuery实现动态操作table行
2020/11/23 jQuery
[58:21]DOTA2亚洲邀请赛 4.3 突围赛 Liquid vs VGJ.T 第二场
2018/04/04 DOTA
Python RabbitMQ消息队列实现rpc
2018/05/30 Python
Django 内置权限扩展案例详解
2019/03/04 Python
Django使用 Bootstrap 样式修改书籍列表过程解析
2019/08/09 Python
使用Python操作ArangoDB的方法步骤
2020/02/02 Python
Python enumerate() 函数如何实现索引功能
2020/06/29 Python
使用phonegap获取设备的一些信息方法
2017/03/31 HTML / CSS
广州一家公司的.NET面试题
2016/06/11 面试题
药品质量检测应届生求职信
2013/11/14 职场文书
安全教育实施方案
2014/03/02 职场文书
学雷锋活动总结报告
2014/06/26 职场文书
2014年家长学校工作总结
2014/11/20 职场文书
2014年医药代表工作总结
2014/11/22 职场文书
抗洪救灾感谢信
2015/01/22 职场文书
银行招聘自荐信
2015/03/06 职场文书
公司员工离职感言
2015/08/03 职场文书
Django如何创作一个简单的最小程序
2021/05/12 Python
pytorch 实现在测试的时候启用dropout
2021/05/27 Python