客户端验证用户名和密码的方法详解


Posted in Javascript onJune 16, 2016

1.概述

在动态网站的用户注册页面中,经常需要对用户输入的用户名和密码的位数及成员组成进行判断,这样可以规范用户的注册信息。例如本实例,要求用户名由3-10位的字母、数字和下划线组成,密码由6-20位的字母、数字、下划线和点“.”组成并且首字符为字母,这时就需要对用户的输入进行判断,因此笔者编写了两个函数,分别用于验证用户输入的用户名和密码是否合法。

2.技术要点

验证用户名是否由3-10位的字母、数字和下划线组成的正则表达式如下:

/^(\w){3,10}$/

验证密码是否由6-20位的字母、数字、下划线和点“.”组成的正则表达式如下:

/^[A-Za-z]{1}([A-Za-z0-9]|[._]){5,19}$/

3.具体实现代码

(1)使用JavaScript编写一个用于验证用户名是否合法的函数checkeusername (),该函数只有一个参数username,用于获取输入的用户名,返回值为true或false。代码如下:

<script language="javascript">
function checkeusername(username){
var str=username;
//在JavaScript中,正则表达式只能使用"/"开头和结束,不能使用双引号
var Expression=/^(\w){3,10}$/; 
var objExp=new RegExp(Expression); //创建正则表达式对象
if(objExp.test(str)==true){ //通过正则表达式验证
return true;
}else{
return false;
}
}
</script>

(2)使用JavaScript编写一个用于验证密码是否合法的函数checkePWD(),该函数只有一个参数PWD,用于获取输入的密码,返回值为true或false。代码如下:

<script language="javascript">
function checkePWD(PWD){
var str=PWD;
//在JavaScript中,正则表达式只能使用"/"开头和结束,不能使用双引号
var Expression=/^[A-Za-z]{1}([A-Za-z0-9]|[._]){5,19}$/; 
var objExp=new RegExp(Expression); //创建正则表达式对象
if(objExp.test(str)==true){ //通过正则表达式验证
return true;
}else{
return false;
}
}
</script>

(3)调用checkeusername()函数和checkePWD()函数分别判断用户输入的用户名和密码是否合法,如果不合法,将给予提示信息。关键代码如下:

<script language="javascript">
function check(myform){
if(myform.username.value==""){
alert("请输入用户名!");myform.username.focus();return;
}
if(!checkeusername(myform.username.value)){
alert("您输入的用户名不合法!");myform.username.focus();return;
}
if(myform.PWD.value==""){
alert("请输入密码!");myform.PWD.focus();return;
}
if(!checkePWD(myform.PWD.value)){
alert("您输入的密码不合法!");myform.PWD.focus();return;
}
if(myform.PWD1.value==""){
alert("请确认密码!");myform.PWD1.focus();return;
}
if(myform.PWD1.value!=myform.PWD.value){
alert("您两次输入的密码不一致,请重新输入!");myform.PWD.focus();return;
}
myform.submit();
}
</script>

以上所述是小编给大家介绍的客户端验证用户名和密码的相关知识,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript的对话框详解与参数
Mar 08 Javascript
基于Jquery的淡入淡出的特效基础练习
Dec 13 Javascript
jQuery UI Autocomplete 体验分享
Feb 14 Javascript
javascript:json数据的页面绑定示例代码
Jan 26 Javascript
jQuery性能优化的38个建议
Mar 04 Javascript
JavaScript setTimeout使用闭包功能实现定时打印数值
Dec 18 Javascript
微信小程序实现实时圆形进度条的方法示例
Feb 24 Javascript
JavaScript函数柯里化原理与用法分析
Mar 31 Javascript
JS仿Base.js实现的继承示例
Apr 07 Javascript
JS随机数产生代码分享
Feb 24 Javascript
vue项目强制清除页面缓存的例子
Nov 06 Javascript
Vue中通过属性绑定为元素绑定style行内样式的实例代码
Apr 30 Javascript
检查表单元素的值是否为空的实例代码
Jun 16 #Javascript
jQuery使用each方法与for语句遍历数组示例
Jun 16 #Javascript
基于JS代码实现实时显示系统时间
Jun 16 #Javascript
JavaScript代码实现图片循环滚动效果
Mar 19 #Javascript
jquery插件格式实例分析
Jun 16 #Javascript
详解JavaScript对象类型
Jun 16 #Javascript
jQuery on()方法绑定动态元素的点击事件实例代码浅析
Jun 16 #Javascript
You might like
详解WordPress开发中get_header()获取头部函数的用法
2016/01/08 PHP
PHP操作FTP类 (上传、下载、移动、创建等)
2016/03/31 PHP
PHP实现对文件锁进行加锁、解锁操作的方法
2017/07/04 PHP
URL编码转换,escape() encodeURI() encodeURIComponent()
2006/12/27 Javascript
jQuery中filter()和find()的区别深入了解
2013/09/25 Javascript
jquery选择器之属性过滤选择器详解
2014/01/27 Javascript
jquery实现手风琴效果
2015/11/20 Javascript
详解Bootstrap的aria-label和aria-labelledby应用
2016/01/04 Javascript
js判断空对象的实例(超简单)
2016/07/26 Javascript
vue父子组件的数据传递示例
2017/03/07 Javascript
Vue之Watcher源码解析(2)
2017/07/19 Javascript
从零开始搭建一个react项目开发
2018/02/09 Javascript
react中fetch之cors跨域请求的实现方法
2018/03/14 Javascript
微信小程序scroll-view实现字幕滚动
2018/07/14 Javascript
看看“疫苗查询”小程序有温度的代码
2018/07/31 Javascript
angularjs性能优化的方法
2018/09/05 Javascript
javascript(基于jQuery)实现鼠标获取选中的文字示例【测试可用】
2019/10/26 jQuery
vuex的使用步骤
2021/01/06 Vue.js
python单例模式实例分析
2015/04/08 Python
编写Python CGI脚本的教程
2015/06/29 Python
Django跨域请求问题的解决方法示例
2018/06/16 Python
Pycharm代码无法复制,无法选中删除,无法编辑的解决方法
2018/10/22 Python
Python MongoDB 插入数据时已存在则不执行,不存在则插入的解决方法
2019/09/24 Python
python函数定义和调用过程详解
2020/02/09 Python
为什么说python适合写爬虫
2020/06/11 Python
CentOS 7如何实现定时执行python脚本
2020/06/24 Python
美国珠宝精品店:Opulent Jewelers
2019/08/20 全球购物
应用服务器有那些
2012/01/19 面试题
幼儿园毕业园长感言
2014/02/24 职场文书
人事科岗位职责范本
2014/03/02 职场文书
网络管理专业求职信
2014/03/15 职场文书
库房保管员岗位职责
2014/04/07 职场文书
工地安全标语
2014/06/07 职场文书
2014年班级工作总结
2014/11/14 职场文书
五四青年节比赛演讲稿
2015/03/18 职场文书
sql中mod()函数取余数的用法
2021/05/29 SQL Server