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 匿名函数的理解(透彻版)
Jan 28 Javascript
jQuery 打造动态下滑菜单实现说明
Apr 15 Javascript
javascript基础第一章 JavaScript与用户端
Jul 22 Javascript
查看源码的工具 学习jQuery源码不错的工具
Dec 26 Javascript
js导出格式化的excel 实例方法
Jul 17 Javascript
jQuery回车实现登录简单实现
Aug 20 Javascript
Js操作树节点自动折叠展开的几种方法
May 05 Javascript
JavaScript脚本库编写的方法
Dec 09 Javascript
微信小程序-拍照或选择图片并上传文件
Jan 06 Javascript
jQuery中layer分页器的使用
Mar 13 Javascript
Vue项目部署在Spring Boot出现页面空白问题的解决方案
Nov 26 Javascript
flexible.js实现移动端rem适配方案
Apr 07 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
用libTemplate实现静态网页的生成
2006/10/09 PHP
增加反向链接的101个方法 站长推荐
2007/01/31 PHP
PHP中for与foreach的区别分析
2011/03/09 PHP
web目录下不应该存在多余的程序(安全考虑)
2012/05/09 PHP
PHP基于CURL进行POST数据上传实例
2014/11/10 PHP
Laravel接收前端ajax传来的数据的实例代码
2017/07/20 PHP
javascript  Error 对象 错误处理
2008/05/18 Javascript
js 格式化时间日期函数小结
2010/03/20 Javascript
javascript html实现网页版日历代码
2016/03/08 Javascript
jQuery操作dom实现弹出页面遮罩层(web端和移动端阻止遮罩层的滑动)
2016/08/25 Javascript
jQuery操作之效果详解
2017/05/19 jQuery
js 获取html5的data属性实现方法
2017/07/28 Javascript
使用VScode 插件debugger for chrome 调试react源码的方法
2019/09/13 Javascript
基于canvas实现手写签名(vue)
2020/05/21 Javascript
小程序中的箭头函数的具体使用
2020/06/19 Javascript
NodeJS模块Buffer原理及使用方法解析
2020/11/11 NodeJs
[01:38]DOTA2 2015国际邀请赛中国区预选赛 Showopen
2015/06/01 DOTA
Python正则表达式经典入门教程
2017/05/22 Python
Python数据结构之哈夫曼树定义与使用方法示例
2018/04/22 Python
Python面向对象程序设计中类的定义、实例化、封装及私有变量/方法详解
2019/02/28 Python
Python爬取数据保存为Json格式的代码示例
2019/04/09 Python
python实现把二维列表变为一维列表的方法分析
2019/10/08 Python
使用python制作一个解压缩软件
2019/11/13 Python
matplotlib事件处理基础(事件绑定、事件属性)
2021/02/03 Python
纽约的奢华内衣店:Journelle
2016/07/29 全球购物
全球性的在线商店:Vogca
2019/05/10 全球购物
银行竞聘演讲稿
2014/05/16 职场文书
2014民事授权委托书范本
2014/09/29 职场文书
社区班子个人对照检查材料思想汇报
2014/10/07 职场文书
基层工作经验证明样本
2014/11/16 职场文书
2015年财务经理工作总结
2015/05/13 职场文书
2016特色励志班级口号
2015/12/24 职场文书
制定企业培训计划的五大要点!
2019/07/10 职场文书
python读取mnist数据集方法案例详解
2021/09/04 Python
解决Python保存文件名太长OSError: [Errno 36] File name too long
2022/05/11 Python
js面向对象编程OOP及函数式编程FP区别
2022/07/07 Javascript