zoukankan      html  css  js  c++  java
  • 随机验证码实现

     1 <!doctype html>
     2 <html lang="zh-CN">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>随机验证码</title>
     6     <style>
     7         div{
     8             height: 20px;
     9             background: url(images/1.jpg);
    10             font-size: 20px;
    11         }
    12         i{
    13             cursor: pointer;
    14         }
    15     </style>
    16     
    17 </head>
    18 <body>
    19     <div id = "imgId">
    20         <span id="a"></span>
    21         <span id="b"></span>
    22         <span id="c"></span>
    23         <span id="d"></span>
    24     </div>
    25     <i onclick="dj()">获取验证码</i>
    26 </body>
    27 </html>
    28 
    29 <script type="text/javascript">
    30 
    31         //随机字母
    32         function sjWord(){
    33             var word = [0,1,2,3,4,5,6,7,8,9,'a','b','c','d','e','f','g','h','i','j','k','l'
    34 ,'m','n','o','p','q','r','s','t','u','v','w','x','y','z','A','B','C','D'
    35 ,'E','F','G','H','I','J','K','L','M','N','O','P','Q','R'
    36 ,'S','T','U','V','W','X','Y','Z'];
    37             var rad = parseInt(Math.random() * word.length);
    38             return word[rad];
    39         }
    40 
    41         //随机颜色
    42         function sjColor(){
    43             var color = [0,1,2,3,4,5,6,7,8,9,'a','b','c','d','e','f'];
    44             var rad = parseInt(Math.random() * color.length);
    45             //alert(color[rad]);
    46             return color[rad];
    47         }
    48         sjColor();
    49         //alert(sjColor());
    50 
    51         //var a = document.getElementById("a");
    52         function dj(){
    53             //clearInterval(timer);
    54             var a = document.getElementById("a");
    55             var b = document.getElementById("b");
    56             var c = document.getElementById("c");
    57             var d = document.getElementById("d");
    58             a.innerHTML = (sjWord());
    59             b.innerHTML = (sjWord());
    60             c.innerHTML = (sjWord());
    61             d.innerHTML = (sjWord());
    62             a.style.color = ("#"+sjColor()+sjColor()+sjColor()+sjColor()+sjColor()+sjColor());
    63             b.style.color = ("#"+sjColor()+sjColor()+sjColor()+sjColor()+sjColor()+sjColor());
    64             c.style.color = ("#"+sjColor()+sjColor()+sjColor()+sjColor()+sjColor()+sjColor());
    65             d.style.color = ("#"+sjColor()+sjColor()+sjColor()+sjColor()+sjColor()+sjColor());
    66         }
    67 
    68         dj();
    69         //var timer = setInterval(dj,2000);
    70 </script>
  • 相关阅读:
    通过jquery和js绑定下拉列表 东师理想
    Struts2中EL表达式与<s:property />细微区别(转载) 东师理想
    SQL Prompt v5.3.0.3 安装文件及方法(支持sqlserver2012) 东师理想
    spring 框架概述 东师理想
    iterator标签 东师理想
    memcached的特征 东师理想
    为什么使用memcached 东师理想
    Hibernate教程,IBatis教程,Spring教程链接地址 东师理想
    .Net反射技术
    云时代的GIS软件技术与应用(一)
  • 原文地址:https://www.cnblogs.com/guangyan/p/6684624.html
Copyright © 2011-2022 走看看