摘要:页面用户名密码密码强度验证码登录代码块弹出消息框简单的验证码验证码背景颜色验证码颜色长度二元运算符强中弱去空格防止注入用户名密码不能为空用户名密码为为位但不限于数字,字母,下划线刷新页面两个参数为提示密码强弱提示性文字,接受
html 页面
用户名:JS代码块
密码:
密码强度:
验证码:
var module = (function() { var testSpan,msg,Slength,userpwd,userpwd,yzm; function print(msg) { alert(msg); } ;//弹出消息框 //简单的验证码 function createyzm(testSpan,Slength){ var str = "0123456789qwertyuioplkjhgfdsazxcvbnmQWERTYUIOPLKJHGFDSAZXCVBNM"; var list = str.split(""); for (i = 0; i < Slength; i++) { var index = Math.floor(Math.random() * list.length); testSpan.style.backgroundColor="#000";//验证码背景颜色 testSpan.style.color="#fff";//验证码颜色 testSpan.style.display="block"; testSpan.style.textAlign ="center"; testSpan.style.width="70px";//长度 testSpan.innerHTML += list[index]; } return testSpan.innerHTML; }; function checkUserpwd(userpwd,errSpan) { var numCount = (/[0-9]/g).test(userpwd) ? 1 : 0; var lowCount = (/[a-z]/g).test(userpwd) ? 1 : 0; var uppCount = (/[A-Z]/g).test(userpwd) ? 1 : 0;//二元运算符 switch (numCount + lowCount + uppCount) { case 3: errSpan.innerHTML = "强"; break; case 2: errSpan.innerHTML = "中"; break; default: errSpan.innerHTML = "弱"; break; return true; } }; function check(username,userpwd){ var uremeber = /^[a-zA-Z0-9_-]{4,16}$/; var username=username.replace(" ",""); var userpwd=userpwd.replace(" ","");//去空格防止sql注入 if(username==""||userpwd=="") { print("用户名密码不能为空"); return false; } if(!uremeber.test(username)||!uremeber.test(userpwd)){ print("用户名密码为为4-16位但不限于(数字,字母,下划线)"); history.go(0);//刷新页面 return false; }else { //... return true; } }; return { checkUserpwd: checkUserpwd,//两个参数userpwd,errSpan errspan为提示密码强弱提示性文字,接受类型是js dom对象 注:jq对象用test方法, // userpwd 为用户密码, check: check,//用户名,密码,验证码 createyzm: createyzm,//testSpan,Slength 两个参数testSpan是验证码span标签dom类型对象,Slength是验证码长度 print: print//alert弹窗 }; })(); var yzm=module.createyzm(document.getElementById("testSpan"),4); document.getElementById("userpwd").onblur = function(){ module.checkUserpwd(this.value,document.getElementById("mm")); } document.getElementById("login").onclick=function(){ var a= module.check(document.getElementById("username").value,document.getElementById("userpwd").value); if(a==true ){ if(document.getElementById("yzm").value==yzm){ alert("登录成功!"); }else{ alert("验证码错误,请重新输入!"); history.go(0);//刷新页面 } } }
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/105126.html
摘要:页面用户名密码密码强度验证码登录代码块弹出消息框简单的验证码验证码背景颜色验证码颜色长度二元运算符强中弱去空格防止注入用户名密码不能为空用户名密码为为位但不限于数字,字母,下划线刷新页面两个参数为提示密码强弱提示性文字,接受 html 页面 用户名: 密码: 密码强度: 验证码: JS代码块 var module = (function() { var testSpan...
摘要:七牛云接入本系统的图片,音视频是放在七牛云,所以需要接入七牛云。在服务端通过接口请求来获取七牛云上传,客户端获取到七牛云,通过不同方案将带上。 效果展示 showImg(https://user-gold-cdn.xitu.io/2018/8/26/16576a709bd02f5f?w=1409&h=521&f=gif&s=30128195); showImg(https://user...
摘要:七牛云接入本系统的图片,音视频是放在七牛云,所以需要接入七牛云。在服务端通过接口请求来获取七牛云上传,客户端获取到七牛云,通过不同方案将带上。 效果展示 showImg(https://user-gold-cdn.xitu.io/2018/8/26/16576a709bd02f5f?w=1409&h=521&f=gif&s=30128195); showImg(https://user...
阅读 933·2021-09-07 09:58
阅读 1483·2021-09-07 09:58
阅读 2868·2021-09-04 16:40
阅读 2500·2019-08-30 15:55
阅读 2404·2019-08-30 15:54
阅读 1363·2019-08-30 15:52
阅读 423·2019-08-30 10:49
阅读 2597·2019-08-29 13:21