zoukankan      html  css  js  c++  java
  • js随机生成验证码以及随机颜色

    Javascript通过Math.random()随机生成验证码。

    代码如下:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>随机验证码</title>
    <style>
    .p1{
    100px;
    height:30px;
    border:1px solid black;
    }
    </style>
    </head>

    //onload页面加载完成后立即触发函数
    <body onload="sj()">
    <input class="p1">
    <p style="font-size:30px;">
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    </p>
    </input>

    //通过onlick(点击事件)触发函数
    <button style="80px;height:30px;" onclick="sj()">换一波</button>

    //引入js外部文件(封装函数)
    <script type="text/javascript" src="../js/sj_fzhs.js"></script>
    <script type="text/javascript">
    //定义随机字符串
    var array="1234567890ABCDEFGHIGKLMNOPQRSTUVWXYZabcdefghigklmnopqrstuvwsyz";

    //获取到span标签
    var span=document.getElementsByTagName('span');

    //定义一个函数
    function sj(){
    var code="";

    //进行for循环
    for(var i=0;i<=6;i++){

    //首先随机数组的长度
    var zm=parseInt(Math.random()*array.length);

    //然后取出随机数组中的真正的值

    code=array[zm];

    //将上面取到的<span>元素通过innerHTML赋值给code
    span[i].innerHTML=code;

    //最后随机出的值通过style.color赋予随机颜色,这里我用到了一个封装函数randomColor()

    span[i].style.color=randomColor();
    }
    }
    </script>

    </body>
    </html>

    //封装函数(随机颜色)

    function randomColor(){
    var r=parseInt(Math.random()*256);
    var g=parseInt(Math.random()*256);
    var b=parseInt(Math.random()*256);
    var rgb="rgb("+r+","+g+","+b+")";
    return rgb;
    }

    //效果图如下:

  • 相关阅读:
    网易官方」极客战记(codecombat)攻略-沙漠-跟上时间-keeping-time
    jenkins 通过使用crumbissuer停止job
    获取crumbIssuer
    解决docker容器vim高度宽度显示不正常
    嵌入skype标签
    pip --user参数
    python requests模块和 urllib.request模块
    python字符识别
    bs4解析xml文件,制作xml文件
    jenkins api
  • 原文地址:https://www.cnblogs.com/cyjfighting/p/8196718.html
Copyright © 2011-2022 走看看