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


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 相关文章推荐
JS日历 推荐
Dec 03 Javascript
ko knockoutjs动态属性绑定技巧应用
Nov 14 Javascript
jquery datatable后台封装数据示例代码
Aug 07 Javascript
Underscore源码分析
Dec 30 Javascript
js实现的简单图片浮动效果完整实例
May 10 Javascript
jquery插件bootstrapValidator数据验证详解
Nov 09 Javascript
关于vuex的学习实践笔记
Apr 05 Javascript
SeaJS中use函数用法实例分析
Oct 10 Javascript
动态加载、移除js/css文件的示例代码
Mar 20 Javascript
Vue作用域插槽slot-scope实例代码
Sep 05 Javascript
JavaScript函数Call、Apply原理实例解析
Feb 17 Javascript
vue下canvas裁剪图片实例讲解
Apr 16 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
我的论坛源代码(七)
2006/10/09 PHP
PHP上传文件时文件过大$_FILES为空的解决方法
2013/11/26 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(十三)
2014/06/26 PHP
PHP中cookie知识点学习
2018/05/06 PHP
PHP isset()及empty()用法区别详解
2020/08/29 PHP
jQuery学习笔记(1)--用jQuery实现异步通信(用json传值)具体思路
2013/04/08 Javascript
jquery隐藏标签和显示标签的实例
2013/11/11 Javascript
使用ajaxfileupload.js实现上传文件功能
2016/08/13 Javascript
判断数组的最佳方法(推荐)
2016/10/11 Javascript
vue子组件使用自定义事件向父组件传递数据
2017/05/27 Javascript
javascript获取指定区间范围随机数的方法
2017/09/08 Javascript
vue+node+webpack环境搭建教程
2017/11/05 Javascript
JS实现为动态创建的元素添加事件操作示例
2018/03/17 Javascript
element UI upload组件上传附件格式限制方法
2018/09/04 Javascript
在webstorm开发微信小程序之使用阿里自定义字体图标的方法
2018/11/15 Javascript
微信小程序使用wxParse解析html的方法示例
2019/01/17 Javascript
CKEditor 4.4.1 添加代码高亮显示插件功能教程【使用官方推荐Code Snippet插件】
2019/06/14 Javascript
浅谈javascript错误处理
2019/08/11 Javascript
纯异步nodejs文件夹(目录)复制功能
2019/09/03 NodeJs
JavaScript代码异常监控实现过程详解
2020/02/17 Javascript
如何使用JavaScript实现无缝滚动自动播放轮播图效果
2020/08/20 Javascript
Python自动化测试工具Splinter简介和使用实例
2014/05/13 Python
速记Python布尔值
2017/11/09 Python
微信小程序跳一跳游戏 python脚本跳一跳刷高分技巧
2018/01/04 Python
Python使用googletrans报错的解决方法
2018/09/25 Python
Scrapy使用的基本流程与实例讲解
2018/10/21 Python
Python编程深度学习绘图库之matplotlib
2018/12/28 Python
Python下应用opencv 实现人脸检测功能
2019/10/24 Python
Python自定义sorted排序实现方法详解
2020/09/18 Python
利用Pycharm + Django搭建一个简单Python Web项目的步骤
2020/10/22 Python
经管应届生求职信
2013/11/17 职场文书
写给女朋友的道歉信
2014/01/08 职场文书
大学生先进个人主要事迹材料
2015/11/04 职场文书
Python爬取某拍短视频
2021/06/11 Python
浅谈Web Storage API的使用
2021/06/23 Javascript
vue elementUI批量上传文件
2022/04/26 Vue.js