前台代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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 runat="server">
    <title></title>
    <script src="checkCode.js" type="text/javascript"></script>
    <style type="text/css">
        #code
        {
            font-family: Arial;
            font-style: italic;
            font-weight: bold;
            border: 0;
            letter-spacing: 2px;
            color: blue;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input type="text" id="input" />
        <input type="button" id="code" onclick="createCode()" />
        <input type="button" value="验证" onclick="validate()" />
    </div>
    </form>
</body>
</html>

我这里是aspx页面。

checkCode.js文件

var code; //在全局定义验证码   
//产生验证码  
window.onload = function createCode() {
    code = "";
    var codeLength = 4; //验证码的长度  
    var checkCode = 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'); //随机数  
    for (var i = 0; i < codeLength; i++) {//循环操作  
        var index = Math.floor(Math.random() * 36); //取得随机数的索引（0~35）  
        code += random[index]; //根据索引取得随机数加到code上  
    }
    checkCode.value = code; //把code值赋给验证码  
}
//校验验证码  
function validate() {
    var inputCode = document.getElementById("vali_code").value.toUpperCase(); //取得输入的验证码并转化为大写        
    if (inputCode.length <= 0) { //若输入的验证码长度为0  
        alert("请输入验证码！"); //则弹出请输入验证码
        return false;
    }
    else if (inputCode != code) { //若输入的验证码与产生的验证码不一致时  
        alert("验证码输入错误！@_@"); //则弹出验证码输入错误  
        createCode(); //刷新验证码  
        document.getElementById("vali_code").value = ""; //清空文本框
        return false;
    }
    else { //输入正确时  
        alert("^-^"); //弹出^-^  
    }
}

js生成验证码并验证的更多相关文章

  1. js生成验证码并且验证

    <html> <head> <title>验证码</title> <style type="text/css"> #co ...

  2. js生成验证码并验证的登录页面

    <!Doctype html> <html> <head> <meta charset="utf-8"/> <title> ...

  3. 纯js生成验证码

    实现代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"& ...

  4. JAVA WEB项目中生成验证码及验证实例（附源码及目录结构）

    [我是一个初学者,自己总结和网上搜索资料,代码是自己敲了一遍,亲测有效,现将所有的目录结构和代码贴出来分享给像我一样的初学者] 作用 验证码为全自动区分计算机和人类的图灵测试的缩写,是一种区分用户是计 ...

  5. H5+JS生成验证码

    效果图如下: <canvas id="canvas1" style="margin-left: 200px;"></canvas>< ...

  6. node.js生成验证码及图片

    示例代码: var svgCaptcha = require('svg-captcha'); var fs = require('fs'); var codeConfig = { size: 5,// ...

  7. js生成验证码并检验

    <html> <head> <title>验证码</title> <style type="text/css"> #co ...

  8. js生成验证码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. js生成验证码并且判断

       <style type="text/css">        .code        {            font-family: Arial;      ...

随机推荐

  1. ML_R Kmeans

    Kmeans作为机器学习中入门级算法,涉及到计算距离算法的选择,聚类中心个数的选择.下面就简单介绍一下在R语言中是怎么解决这两个问题的. 参考Unsupervised Learning with R ...

  2. Cotex-M3内核STM32F10XX系列时钟及其配置方法

    一.背景 最近做个项目,需要使用STM32,还是以前一样的观点,时钟就是MCU心脏,供血即时钟频率输出,想要弄明白一个MCU,时钟是一个非常好的切入点.言归正传,网上已经有太多大神详述过STM32的详 ...

  3. 将json返回的日期格式转换

    <script>         function ChangeDateFormat(cellval) {             var date = new Date(parseInt ...

  4. 【C语言入门教程】1.2 函数库 和 链接

    程序员可以不需要从头开始设计每一个函数,完成用C语言命令所实现的函数非常罕见.因为所有的C语言编辑器都提供能完成各种常见任务函数,如printf()函数等.C语言编译器的实现者已经编写了大部分常见的通 ...

  5. 【C语言入门教程】2.1 数据类型（5种基本数据类型），聚合类型与修饰符

    C语言有5种基本的数据类型,分别为 字符型.整型.单精度浮点型.双精度浮点型.空类型. 在不同的操作系统或硬件平台中,这些数据类型的值域范围和所占用的内存是有差异的.这种差异影响了C语言的可移植性能, ...

  6. JS写的多级联select,如何取值

    var $ = function (id) {    return "string" == typeof id ? document.getElementById(id) : id ...

  7. PHPCMS调用form类编辑器editor函数动态上传图片附件

    http://w3note.com/web/49.html phpcms v9的系统类库有一个表单类,它封装了表单的一些组件,如编辑器.图片上传.时间选择器.模板选 择器等,更详细请参考form.cl ...

  8. Android 网络请求框架android-async-http问题

    今天通过接口请求服务器的一些app数据,发现一个很奇怪的问题,请求一个链接的时候,通常在第一次请求发起的时候没有什么问题,能很快的拿到数据,但是 往后再去请求的时候就会等待很久,而且最后会请求失败,一 ...

  9. maven引入jar包时，一个jar的引入错误，会导致后来的jar包的引入。

    maven引入本jar包时,引入失败. 问题是另一个jar没有引入正确.

  10. Codeforces Round #292 (Div. 2) C. Drazil and Factorial

    题目链接:http://codeforces.com/contest/515/problem/C 给出一个公式例如:F(135) = 1! * 3! * 5!; 现在给你一个有n位的数字a,让你求这样 ...