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 相关文章推荐
捕获关闭窗口的脚本
Jan 10 Javascript
13 个JavaScript 性能提升技巧分享
Jul 26 Javascript
JavaScript语言核心数据类型和变量使用介绍
Aug 23 Javascript
方便实用的jQuery checkbox复选框全选功能简单实例
Oct 09 Javascript
AngularJS 中的指令实践开发指南(一)
Mar 20 Javascript
详谈js使用in和hasOwnProperty获取对象属性的区别
Apr 25 Javascript
iscroll动态加载数据完美解决方法
Jul 18 Javascript
如何理解Vue的作用域插槽的实现原理
Aug 19 Javascript
js仿微信抢红包功能
Sep 25 Javascript
Vue组件教程之Toast(Vue.extend 方式)详解
Jan 27 Javascript
vue登录注册实例详解
Sep 14 Javascript
vue中用 async/await 来处理异步操作
Jul 18 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 expects parameter 1 to be resource, array given 错误
2011/03/23 PHP
PHP 实现的将图片转换为TXT
2015/10/21 PHP
php 一维数组的循环遍历实现代码
2017/04/10 PHP
ThinkPHP中获取指定日期后工作日的具体日期方法
2018/10/14 PHP
Laravel 自动转换长整型雪花 ID 为字符串的实现
2020/10/27 PHP
类似GMAIL的Ajax信息反馈显示
2010/02/16 Javascript
jQuery find和children方法使用
2011/01/31 Javascript
两种方法基于jQuery实现IE浏览器兼容placeholder效果
2014/10/14 Javascript
javascript实现Email邮件显示与删除功能
2015/11/21 Javascript
jQuery前端开发35个小技巧
2016/05/24 Javascript
几种二级联动案例(jQuery\Array\Ajax php)
2016/08/13 Javascript
AngularJS实践之使用NgModelController进行数据绑定
2016/10/08 Javascript
jQuery Easyui datagrid连续发送两次请求问题
2016/12/13 Javascript
Js自动截取字符串长度,添加省略号(……)的实现方法
2017/03/06 Javascript
记React connect的几种写法(小结)
2018/09/18 Javascript
JS数组方法shift()、unshift()用法实例分析
2020/01/18 Javascript
Python Web框架Flask下网站开发入门实例
2015/02/08 Python
python使用webbrowser浏览指定url的方法
2015/04/04 Python
介绍Python中内置的itertools模块
2015/04/29 Python
PyQt5每天必学之弹出消息框
2018/04/19 Python
python实现图片彩色转化为素描
2019/01/15 Python
Django认证系统user对象实现过程解析
2020/03/02 Python
基于python判断字符串括号是否闭合{}[]()
2020/09/21 Python
Css3+Js制作漂亮时钟(附源码)
2013/04/24 HTML / CSS
CSS3实现缺角矩形,折角矩形以及缺角边框
2019/12/20 HTML / CSS
CSS3 实现的火焰动画
2020/12/07 HTML / CSS
HTML5适合的情人节礼物有纪念日期功能
2021/01/25 HTML / CSS
美国顶级户外凉鞋品牌:Chacos
2017/03/27 全球购物
幼儿园教师教学反思
2014/02/06 职场文书
《燕子》教学反思
2014/02/18 职场文书
副护士长竞聘演讲稿
2014/04/30 职场文书
团日活动总结格式
2015/05/11 职场文书
卫生保健工作总结2015
2015/05/18 职场文书
python基础之匿名函数详解
2021/04/21 Python
go语言使用Casbin实现角色的权限控制
2021/06/26 Golang
MySql子查询IN的执行和优化的实现
2021/08/02 MySQL