前台代码：

<%@ 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. 微信公众平台中添加qq在线聊天代码

    微信公众平台是个不错的媒体,可以和你的小伙伴们即时交流,但你的小伙伴们是用手机上的微信,打字自然就慢了:有人说用微信网页版,那个也不习惯,再说也不一定所有人都知道网页版微信.(2014.01.22更新 ...

  2. Java中将unix时间戳转化为正常显示时间

    在unix中时间戳是一串数字表示的,使用起来非常不方便,转化方式如下: //Convert Unix timestamp to normal date style public String Time ...

  3. Ubuntu 14 添加Windows风格的底部任务栏

    习惯了Windows风格的底部任务栏,而Ubuntu 14是没有的,还好有人做好了一个任务栏插件,可以在线安装: 1.打开终端(Ctrl+Alt+T),然后输入下面的命令 sudo apt-get i ...

  4. ubuntu下修改apache2.4的rewrite

    sudo a2enmod rewrite 修改/etc/apache2/apache2.conf中 AllowOverride None 为 AllowOverride ALL 重启 service ...

  5. PowerDesigner的使用（一）

    一. PowerDesigner 功能 1. 需求管理:记录需求,分析设计模型 2. 生成文档:生成HTML格式文档,方便沟通. 3. 影响度分析:模型之间连接起来,同步修改功能. 4. 数据映射:提 ...

  6. this.getServletContext().getRealPath("WEB-INF");

    this.getServletContext().getRealPath("WEB-INF");

  7. Sqli-LABS通关笔录-15

    这关是延时的了. Payload: -admin' or sleep(10)# 需要注意的是,--+不行反而#才可以.具体缘由可见<sql注入之你问我答>第20问:http://www.c ...

  8. ACM-括号匹配问题

    对ACM仰慕已久,无奈今天才开始.好吧,遇到的第二个题目就把我难到了.(实话是第一个) 进入正题,下面Copy出题目:  现在,有一行括号序列,请你检查这行括号是否配对. 输入 第一行输入一个数N(0 ...

  9. linux下VMware安装出现的问题解决

    linux下VMware安装出现的问题解决 linux下VMware安装出现的问题解决 报错信息 问题1liboverlay-scrollbar.so和libunity-gtk-module.so加载 ...

  10. Python判断当前用户是否是root

    import osif os.geteuid() != 0:print "This program must be run as root. Aborting."sys.exit( ...