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 相关文章推荐
模仿JQuery sortable效果 代码有错但值得看看
Nov 05 Javascript
对 lightbox JS 图片控件进行了一下改造, 使其他支持复杂的图片说明
Mar 20 Javascript
实现局部遮罩与关闭原理及代码
Feb 04 Javascript
如何使用jQuery来处理图片坏链具体实现步骤
May 02 Javascript
跟我学习javascript的var预解析与函数声明提升
Nov 16 Javascript
JS实现一次性弹窗的方法【刷新后不弹出】
Dec 26 Javascript
Bootstrap布局之栅格系统学习笔记
May 04 Javascript
浅谈基于Vue.js的移动组件库cube-ui
Dec 20 Javascript
Koa项目搭建过程详细记录
Apr 12 Javascript
微信小程序实现保存图片到相册功能
Nov 30 Javascript
详解Vue This$Store总结
Dec 17 Javascript
使用Vant完成DatetimePicker 日期的选择器操作
Nov 12 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
Windows下PHP的任意文件执行漏洞
2006/10/09 PHP
Ajax和PHP正则表达式验证表单及验证码
2016/09/24 PHP
关于Anemometer图形化显示MySQL慢日志的工具搭建及使用的详细介绍
2020/07/13 PHP
图片自动更新(说明)
2006/10/02 Javascript
JavaScript中常见陷阱小结
2010/04/27 Javascript
多种方法实现360浏览器下禁止自动填写用户名密码
2014/06/16 Javascript
JS判断输入的字符串是否是数字的方法(正则表达式)
2016/11/29 Javascript
xmlplus组件设计系列之树(Tree)(9)
2017/05/02 Javascript
详解nodejs异步I/O和事件循环
2017/06/07 NodeJs
JavaScript之json_动力节点Java学院整理
2017/06/29 Javascript
angular 实现同步验证器跨字段验证的方法
2019/04/11 Javascript
javascript二维数组和对象的深拷贝与浅拷贝实例分析
2019/10/26 Javascript
js实现有趣的倒计时效果
2021/01/19 Javascript
[02:41]辉夜杯现场一家三口 “我爸玩风行 我玩血魔”
2015/12/27 DOTA
Python生成随机数的方法
2014/01/14 Python
python为tornado添加recaptcha验证码功能
2014/02/26 Python
Python实现简单的获取图片爬虫功能示例
2017/07/12 Python
python 编码规范整理
2018/05/05 Python
Django 外键的使用方法详解
2019/07/19 Python
django的聚合函数和aggregate、annotate方法使用详解
2019/07/23 Python
深入理解Python 多线程
2020/06/16 Python
Cpython解释器中的GIL全局解释器锁
2020/11/09 Python
python全栈开发语法总结
2020/11/22 Python
pycharm 2020.2.4 pip install Flask 报错 Error:Non-zero exit code的问题
2020/12/04 Python
Fenty Beauty官网:蕾哈娜创立的美妆品牌
2021/01/07 全球购物
测绘工程专业个人自我评价
2013/12/01 职场文书
歌唱比赛获奖感言
2014/01/21 职场文书
会计学生自我鉴定
2014/02/06 职场文书
老同学聚会感言
2014/02/23 职场文书
小学生倡议书范文
2014/05/13 职场文书
运动会广播稿200米(5篇)
2014/10/15 职场文书
英文辞职信范文
2015/05/13 职场文书
2015年党总支工作总结
2015/05/25 职场文书
详解如何在Canvas中添加事件的方法
2021/04/17 Javascript
90行Python代码开发个人云盘应用
2021/04/20 Python
mysql 8.0.27 绿色解压版安装教程及配置方法
2022/04/20 MySQL