js验证码

你的名字 2024-02-18 14:45 66阅读 0赞

js验证码

完成后：

![619b7cd946f7f6fa38012f37.jpg][]

<html>
    <head>
    <style type="text/css">
    .code{
    background-image:url(code.jpg);
    font-family:Arial;
    font-style:italic;
    color:Red;
    border:0;
    padding:2px 3px;
    letter-spacing:3px;
    font-weight:bolder;
    }
    .unchanged {
    border:0;
    }
    </style>
    <script language="javascript" type="text/javascript">
    var code ; //在全局 定义验证码
    function createCode(){ 
    code = "";
    var codeLength = 4;//验证码的长度
    var checkCode = document.getElementById("checkCode");
    checkCode.value = "";
    
    var selectChar = new Array(2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','J','K','L','M','N','P','Q','R','S','T','U','V','W','X','Y','Z');
    
    for(var i=0;i<codeLength;i++) {
       var charIndex = Math.floor(Math.random()*32);
       code +=selectChar[charIndex];
    }
    if(code.length != codeLength){
       createCode();
    }
    checkCode.value = code;
    }
    
    function validate () {
    var inputCode = document.getElementById("input1").value.toUpperCase();
    
    if(inputCode.length <=0) {
       alert("请输入验证码！");
       return false;
    }
    else if(inputCode != code ){
       alert("验证码输入错误！");
       createCode();
       return false;
    }
    else {
       alert("OK");
       return true;
    }
    
    }
    </script>
    </head>
    <body οnlοad="createCode();">
    <input type="text" id="input1" />
    <input type="text" id="checkCode" class="code" style="width: 55px" /> <a href="#" οnclick="createCode()">看不清楚</a><br /><br />
    <center><input id="Button1" οnclick="validate();" type="button" value="确定" /></center>
    <script></script>
    </body>
    </html>

[619b7cd946f7f6fa38012f37.jpg]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/b0a83fdc82c84bd6b87d552a7b0baabb.png