JavaScript--验证码随机生成

在网上看了一下，总结总结！

思路：一个文本框，两个按钮，一个点击操作（验证），一个用来显示验证码，页面加载后就显示验证码，点击验证码触发方法，获取新的验证码

css样式：

<style>
        #code {
            font-family: Arial;
            font-style: italic;
            font-weight: bold;
            border: 0;
            letter-spacing: 2px;
            color: blue;
        }
    </style>

js代码：

 <script>
        var code;
        function createCode() {
            //首先默认code为空字符串
            newCode = '';
            //设置长度
            var codeLength = 4;
            //获取验证码模块
            var oldCode = document.getElementById('code');
            //设置随机字符
            var random = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z');
            //循环codeLength
            for (var i = 0; i < codeLength; i++) {
                //设置随机数范围,Math.random()*36会产生一个[0,36)的数，注意其中包含了小数，例如产生的数为5.5，则math.floor(5.5)=5
                var index = Math.floor(Math.random() * 36);
                //字符串拼接 将每次随机的字符 进行拼接
                newCode += random[index];
            }
            //将拼接好的字符串赋值给展示的Value
            oldCode.value = newCode;
        }
        //一个用来显示验证码，页面加载后就显示验证码，点击验证码触发方法，获取新的验证码
        //按钮点击方法，判断文本框内输入的内容和验证码是否一致
        function validate() {
            var oValue = document.getElementById('input').value.toUpperCase();//toUpperCase() 方法用于把字符串转换为大写。
            if (oValue == 0) {
                alert('请输入验证码');
            } else if (oValue != code) {
                alert('验证码不正确，请重新输入');
                oValue = ' ';
                createCode();
            } else {
                //输入正确后的操作.....
            }
        }

        //页面加载就产生一个验证码
        window.onload = function () {
            createCode();
        }
    </script>

HTML代码：

 <div>
            <div>
                <input type="text" id="input" value="" />
                <input type="button" id="code" onclick="createCode()" />
                <input type="button" value="验证" onclick="validate()" />
            </div>
        </div>