javaweb登录界面,js生成随机验证码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #center{ width: 16%; margin: 0 auto; } #checkcode{ background-color: rgb(201, 208, 212); color: blue; font-size: 30px; } #renew{ color: blue; text-decoration:underline; cursor:pointer; } </style> </head> <body> <div id="center"> <h1 style="text-align: center">用户登录</h1> <form action="" method="post"> 账号:<input type="text" name="name"><br><br> 密码:<input type="password" name="password"><br><br> 验证码:<input type="text" id="inputcode"><br><br> <span id="checkcode">123456</span> <a id="renew">看不清,换一张</a><br><br> <button id="check">确定</button> <input type="reset" value="重置"> <script> //加载时生成验证码 window.onload=function(){//打开网页,立刻执行函数 var res=getcode(); function getcode(){ var str=''; for(var i=0;i<6;i++){ var num=Math.round(Math.random()*9); str +=num; } return str; } document.getElementById('checkcode').innerText=res; //点击生成验证码 document.getElementById('renew').onclick=function(){ document.getElementById('checkcode').innerText=getcode(); } //点击确定检验验证码 document.getElementById('check').onclick=function(){ var code=document.getElementById('checkcode').innerText; var inputcode=document.getElementById('inputcode').value; if(code != inputcode){ window.alert("您输入的验证码不正确"); document.getElementById('inputcode').value='' document.getElementById('checkcode').innerText=getcode(); return false; } } } </script> </form> </div> </body> </html>
标签:function,blue,color,9.15,验证码,var From: https://www.cnblogs.com/0608lin/p/17705937.html