直播商城源码,记一次 js随机密码
直播商城源码,记一次 js随机密码
前端需要随机密码生成,利用数字、大小写、特殊字符自动生成,纯JS实现
1 | <html><br> <head><br> <title>随机密码</title><br> <style><br> .hid {<br> display: none;<br> }<br> .org{<br> font-weight: normal;<br> color: #F7B500;<br> }<br> .red{<br> color:#da1318<br> }<br> .qgreen{<br> color:#8BC34A<br> }<br> .green{<br> color:#467a05<br> }<br> </style><br> </head><br> <body><br> <div class = "Box" ><br> <label>密码长度:</label><input id= "inum" type= "number" value= "10" /><br> </div><br> <div class = "Box" ><br> <label>所含字符:</label><br> <input type= "checkbox" class = "checkbox" data-text= "number_array" name= "checkText" checked= "checked" ><em class = "strTxt" >数字 0-9</em><br> <input type= "checkbox" class = "checkbox" data-text= "letter_lowercase_array" name= "checkText" checked= "checked" ><em class = "strTxt" >小写字母 a-z</em><br> <input type= "checkbox" class = "checkbox" data-text= "letter_capital_array" name= "checkText" checked= "checked" ><em class = "strTxt" >大写字母 A-Z</em><br> <input type= "checkbox" class = "checkbox" data-text= "special_char_array" name= "checkText" checked= "checked" ><em class = "strTxt" >常用符号 ~!@#$%^&*()_+</em><br> </div><br> <br> <button onclick= "generate_pw()" >生产密码</button><br> <div class = "Box" ><br> <label>密码:</label><input id= "newpw" type= "text" /><br> <em id= "msgColor" class = "hid" >(检测提示(1-4):<em id= "msg" >密码强度高</em>)</em><br> </div><br> </body><br><script type= 'text/javascript' ><br> <br> function generate_pw(){<br> var pwdLen= document.getElementById( "inum" ).value;<br> pwdLen=pwdLen?pwdLen:10;<br> var ElementCheckText=document.getElementsByName( "checkText" );<br> var isNumber= ElementCheckText[0].checked;<br> var isLowerCase= ElementCheckText[1].checked;<br> var isUpperCase= ElementCheckText[2].checked;<br> var isSpecialChars= ElementCheckText[3].checked;<br> var newpwd=getRandomPwd(pwdLen,isNumber,isLowerCase,isUpperCase,isSpecialChars);<br> document.getElementById( "newpw" ).value=newpwd<br> var passwordStrong=validate(newpwd);<br> var ElementMsgColor = document.getElementById( 'msgColor' );<br> var ElementMsg = document.getElementById( 'msg' );<br> ElementMsgColor.setAttribute( "class" , "hid" );<br> switch (passwordStrong){<br> case 1:<br> ElementMsgColor.setAttribute( "class" , "red" );<br> ElementMsg.innerHTML= '密码强度1:差' ;<br> break ;<br> case 2:<br> ElementMsgColor.setAttribute( "class" , "org" );<br> ElementMsg.innerHTML= '密码强度2:良好' ;<br> break ;<br> case 3:<br> ElementMsgColor.setAttribute( "class" , "qgreen" );<br> ElementMsg.innerHTML= '密码强度3:高' ;<br> break ;<br> case 4:<br> ElementMsgColor.setAttribute( "class" , "green" );<br> ElementMsg.innerHTML= '密码强度4:强' ;<br> break ;<br> }<br> <br> <br> }<br> <br> function validate(sValue){<br> let passwordStrong = 0;<br> //正则表达式验证符合要求的<br> if (sValue.length < 1) return passwordStrong;<br> if (/\d/.test(sValue)) passwordStrong++; //数字<br> if (/[a-z]/.test(sValue)) passwordStrong++; //小写<br> if (/[A-Z]/.test(sValue)) passwordStrong++; //大写<br> if (/\W/.test(sValue)) passwordStrong++; //特殊字符<br> return passwordStrong<br> }<br> /*<br> 获取随机密码<br> psdLen:密码长度<br> isNumber:是否包含字母<br> isLowerCase:是否包含小写<br> isUpperCase:是否包含大写<br> isSpecialChars:是否包含特殊字符<br> */<br> function getRandomPwd(pwdLen,isNumber,isLowerCase,isUpperCase,isSpecialChars){<br> var number='1234567890';<br> var lowerCase='abcdefghijklmnopqrstuvwxyz';<br> var upperCase='ABCDEFGHIJKLMNOPQRSTUVWXYZ';<br> var specialChars='~!@#$%^&*()_+';<br> <br> var dictionary='';<br> <br> if(isNumber)dictionary+=number;<br> if(isLowerCase)dictionary+=lowerCase;<br> if(isUpperCase)dictionary+=upperCase;<br> if(isSpecialChars)dictionary+=specialChars;<br> if(dictionary=='')return ''<br> let str = '';<br> for(let i=0;i<pwdLen;i++){<br> str += dictionary[parseInt(Math.random()*dictionary.length)]<br> }<br> return str<br> }<br> <br> <br> <br></script><br></html> |
以上就是 直播商城源码,记一次 js随机密码,更多内容欢迎关注之后的文章
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现
2022-03-08 短视频直播系统,选择选项时,点击出现下拉框
2022-03-08 手机直播源码,验证码自动读秒倒计时
2022-03-08 直播软件搭建,通过Android DrawerLayout实现侧边栏功能