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模块化和命名空间管理的问题说明
Dec 06 Javascript
JQuery中getJSON的使用方法
Dec 13 Javascript
动态标签 悬停效果 延迟加载示例代码
Nov 21 Javascript
JavaScript+canvas实现七色板效果实例
Feb 18 Javascript
javascript拖拽应用实例(二)
Mar 25 Javascript
JavaScript简单获取页面图片原始尺寸的方法
Jun 21 Javascript
jQuery实现的鼠标响应缓冲动画效果示例
Feb 13 jQuery
vue+axios新手实践实现登陆的示例代码
Jun 06 Javascript
javascript实现商品图片放大镜
Nov 28 Javascript
微信小程序实用代码段(收藏版)
Dec 17 Javascript
JavaScript进阶(三)闭包原理与用法详解
May 09 Javascript
Javascript表单序列化原理及实现代码详解
Oct 30 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
收音机鉴频器对声音的影响和频偏分析
2021/03/02 无线电
php计算2个日期的差值函数分享
2015/02/02 PHP
linux下实现定时执行php脚本
2015/02/13 PHP
多个Laravel项目如何共用migrations详解
2018/09/25 PHP
PHP检查文件是否存在,不存在自动创建及读取文件内容操作示例
2020/01/23 PHP
Javascript 个人笔记(没有整理,很乱)
2007/07/07 Javascript
jquery分页插件jquery.pagination.js使用方法解析
2016/04/01 Javascript
JS本地刷新返回上一页代码
2016/07/25 Javascript
BootStrap实现带有增删改查功能的表格(DEMO详解)
2016/10/26 Javascript
微信开发 使用picker封装省市区三级联动模板
2016/10/28 Javascript
解决jQuery ajax动态新增节点无法触发点击事件的问题
2017/05/24 jQuery
Node.js中多进程模块Cluster的介绍与使用
2017/05/27 Javascript
bootstrap模态框关闭后清除模态框的数据方法
2018/08/10 Javascript
Vue2.x Todo之自定义指令实现自动聚焦的方法
2019/01/08 Javascript
vue滚动tab跟随切换效果
2020/06/29 Javascript
浅谈vue的第一个commit分析
2020/06/08 Javascript
使用next.js开发网址缩短服务的方法
2020/06/17 Javascript
vue中解决chrome浏览器自动播放音频和MP3语音打包到线上的实现方法
2020/10/09 Javascript
Python内置函数dir详解
2015/04/14 Python
python使用wxpython开发简单记事本的方法
2015/05/20 Python
python OpenCV学习笔记直方图反向投影的实现
2018/02/07 Python
详解Django中六个常用的自定义装饰器
2018/07/04 Python
浅谈python的dataframe与series的创建方法
2018/11/12 Python
基于TensorFlow常量、序列以及随机值生成实例
2020/01/04 Python
python openpyxl模块的使用详解
2021/02/25 Python
js实现移动端H5页面手指滑动刻度尺功能
2017/11/16 HTML / CSS
德国婴儿服装和婴儿用品购买网站:Baby Sweets
2019/12/08 全球购物
汉米尔顿手表官网:Hamilton
2020/09/13 全球购物
优秀辅导员事迹材料
2014/02/16 职场文书
手术室护士长竞聘书
2014/03/31 职场文书
反四风对照检查材料
2014/09/22 职场文书
新学期红领巾广播稿
2014/10/04 职场文书
2014年挂职干部工作总结
2014/12/06 职场文书
SqlServer数据库远程连接案例教程
2021/07/15 SQL Server
Node.js实现爬取网站图片的示例代码
2022/04/04 NodeJs
我去timi了,一起去timi是什么意思?
2022/04/13 杂记