zoukankan      html  css  js  c++  java
  • JS功能来实现登陆验证码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style type="text/css">
    #checkHR {
    float:left;

    }
    #checkCode {
    float:left;
    90px;
    height:15px;
    padding: 0px 10px;
    color:red;
    font-size:16px;
    font-family:Arial;
    font-style:italic;
    color:Red;
    border:0;
    padding:2px 3px;
    letter-spacing:3px;
    font-weight:bolder;
    }
    .refresh {
    font-size: 14px;
    color: red;
    }
    .text {
    font-size: 16px;
    color: #F00;
    }
    </style>
    <script language="javascript" type="application/javascript">
    var code="" ; //在全局 定义验证码
    function createCode(){
    code = "";
    var codeLength = 6;//验证码的长度
    var checkCode = document.getElementById("checkCode");
    checkCode.value = "";
    var selectChar = new Array(0,1,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();
    }
    document.getElementById("checkCode").innerHTML = code;
    }

    function validate () {
    var inputCode = document.getElementById("checkNum").value.toUpperCase();

    if(inputCode.length <=0) {
    alert("请输入验证码!");
    return false;
    }
    else if(inputCode != code ){
    alert("验证码输入错误!");
    createCode();
    return false;
    }
    else {
    alert("验证码通过!");
    return true;
    }

    }
    </script>
    </head>

    <body onload="createCode();" bgcolor="#33CCFF">
    <table width="521" height="37" align="center">
    <tr>
    <td width="291"><div id="checkHR"><span class="text">请输入验证码:</span>
    <input type="text" value="" id="checkNum" style="height:15px;"/></div></td>
    <td width="101"><a href="javascript:void(0);"><div id="checkCode" onclick="createCode()";></div></a></td>
    <td width="104"><input type="button" class="btnCheck" id="gotoCheck" value="验证" onclick="validate();" style="50px; height:25px; color:#39F;"/></td>
    </tr>
    </table>



    </body>
    </html>

  • 相关阅读:
    Git 安装使用及基础命令
    Ubuntu Anaconda3 环境下安装caffe
    Anaconda 安装及Python 多版本间切换
    基于 ZooKeeper 的分布式锁实现
    java 判断点是否在一条线段上
    python 安装opencv及问题解决
    python Opencv图像基础操作
    sctf pwn200
    BCTF warmup 50
    linux shadow破解
  • 原文地址:https://www.cnblogs.com/king-/p/4126867.html
Copyright © 2011-2022 走看看