这是一个简单的js编写的验证码，自己已经亲自验证，没有问题了

 <!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>

 <title>js编写验证码</title>

     <style type="text/css" >  

         .code

         {

             background-image:url(code.jpg);

             font-family:Arial;

             font-style:italic;

             color:Red;

             border:0;

             padding:2px 3px;

             letter-spacing:3px;

             font-weight:bolder;

         }   

         .unchanged

         {

             border:0;

         }

     </style>

     <script language="javascript" type="text/javascript">

      var code ; //在全局 定义验证码

      function createCode()

      {

        code = "";

        var codeLength = 6;//验证码的长度

        var checkCode = document.getElementById("checkCode");

        var selectChar = 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 charIndex = Math.floor(Math.random()*36);   //Math.random得到0-36中随机的一个数,floor取整数部分

        code +=selectChar[charIndex];

        }

 //       alert(code);

        if(checkCode)

        {

          checkCode.className="code";

          checkCode.value = code;

        }

      }   

       function validate ()

      {   

        var inputCode = document.getElementById("input1").value;

        if(inputCode.length <=0)

        {

            alert("请输入验证码！");

        }

        else if(inputCode != code )

        {

          alert("验证码输入错误！");

           createCode();//刷新验证码

        }

        else

        {

          alert("^-^ OK");

        }   

      }   

     </script>

 </head>

 <body onload="createCode()" >

 <form  action="#">

   <input  type="text"   id="input1" />

 <input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px"  /><br />  

     <input id="Button1"  onclick="validate();" type="button" value="确定" />    

 </form>

 </body>

 </html>

一定要在body出onload不然第一次加载的时候看不到验证码

js编写验证码的更多相关文章

  1. 为Node.js编写组件的几种方式

    本文主要备忘为Node.js编写组件的三种实现:纯js实现.v8 API实现(同步&异步).借助swig框架实现. 关键字:Node.js.C++.v8.swig.异步.回调. 简介 首先介绍 ...

  2. Breach - HTML5 时代，基于 JS 编写的浏览器

    Breach 是一款属于 HTML5 时代的开源浏览器项目,,完全用 Javascript 编写的.免费.模块化.易于扩展.这个浏览器中的一切都是模块,Web 应用程序在其自己的进程运行.通过选择合适 ...

  3. 关于错位动画的练习，原生js编写

    最近在网上看到一个关于错位动画的文章,感觉非常有趣,便自己练习了一下,文章连接:http://www.w3cplus.com/animation/staggering-animations.html ...

  4. Node.js编写CLI的实践

    导语:通常而言,Node.js的应用场景有前后端分离.海量web页面渲染服务.命令行工具和桌面端应用等等.本篇文章选取CLI(Command Line Tools)这子领域,来谈谈Node.js编写C ...

  5. 用JS编写一个函数，返回数组中重复出现过的元素

    用JS编写一个函数,返回数组中重复出现过的元素,见下面的代码: , , , , , , , ]; var getRepeat = function (arr) { var obj = {}; , le ...

  6. 怎么用js编写1——100的质数？

    这里来自csdn问答的一个问题,怎么用js编写1——100的质数? http://ask.csdn.net/questions/214429 质数也就是素数,即只能被1和自身整除的数,因此可以构造循环 ...

  7. js简单验证码的生成和验证

    如何用js生成简单验证码,并验证是否正确的方法 1.html页面如下 <div> <table border="0" cellspacing="5&qu ...

  8. Node.js编写be的流程(express)

    Node.js编写be的流程 1.当前项目目录下首先安装express 2.自动生成express插件结构 express -e 3.执行完前两步的效果      4.此时的package.json ...

  9. js编写轮播图，广告弹框

    1.轮播图 js编写轮播图,需要用到setInterval(计时器):先给一个div,里面放轮播图的图片,将轮播图的图片明明为相同样式的:如:banner1.jpg,banner2.jpg,banne ...

随机推荐

  1. IOS中类的扩展（协议，分类）

    IOS中类的扩展(协议,分类) 扩展类,我们可以使用协议和分类这两种方法,下面我们来分别实现这两种方法: 参考网址:http://www.cnblogs.com/wendingding/p/37095 ...

  2. 多线程（NSThread、NSOperation、GCD）编程浅谈

    一.基本概念 进程:一个具有一定独立功能的程序关于某个数据集合的一次运行活动.可以理解成一个运行中的应用程序.线程:程序执行流的最小单元,线程是进程中的一个实体.同步:只能在当前线程按先后顺序依次执行 ...

  3. 体验Impress.js

    用腻了ppt,prezi的风格看起来更酷一点儿,无意中得知有Impress.js这么一个H5版的prezi,nice,值得一试. 关于Impress.js,网上教程很多,但说实话就跟教小朋友一样,一步 ...

  4. PHPMailer中文说明

    PHPMailer中文说明 A开头: $AltBody --属性出自:PHPMailer ::$AltBody文件:class.phpmailer .php说明:该属性的设置是在邮件正文不支持HTML ...

  5. Linux磁盘管理：LVM逻辑卷的拉伸及缩减

    ①查看当前VG的信息,保证VG中有足够的空闲空间 通过 vgdisplay 或者 vgs 命令 [root@rusky ~]# vgs rusky-vg VG #PV #LV #SN Attr VSi ...

  6. ASP.NET过滤器、URL重写

    过滤器可以对指定的URL访问进行拦截,并执行过滤器的方法,根据实际应用情况,在过滤器中修改请求的代码.判断会话信息,也可以做权限控制. 一:编写过滤器,实现URL重写并配置过滤 编写过滤器,就是编写一 ...

  7. Day5 - Python基础5 常用模块学习

    Python 之路 Day5 - 常用模块学习   本节大纲: 模块介绍 time &datetime模块 random os sys shutil json & picle shel ...

  8. Chain of Responsibility 责任链模式

    简介 责任链模式是一种对象的行为模式.在责任链模式里,很多对象由每一个对象对其[下家]的引用而连接起来形成一条链,请求在这个链上[传递],直到链上的某一个对象决定处理此请求.发出这个请求的客户端并不知 ...

  9. Android中px、dp、sp的区别

    px: 即像素,1px代表屏幕上一个物理的像素点: px单位不被建议使用,因为同样100px的图片,在不同手机上显示的实际大小可能不同,如下图所示(图片来自android developer guid ...

  10. phpstudy apache 刚启动便停止

    1.添加站点 2.重启服务 3.遇见问题 apache 刚启动,1秒钟中后就停止 4.解决问题 发现是自己添加的网站中包含中文路径的问题,建议不要在自己的网站目录下包含中文.