[网络收集]JavaScrip生成验证码

/*
getCheckCode(elementId)生成验证码，将在Id为elementId的HTML元素的innerHTML中写入HTML图片源码
CheckCodeOK("用户输入的验证码") 返回true，即为通过验证
*/
var imgFolderPath="images/CheckCode/";  //存放路径
var fileExt=".gif";  //文件扩展名，要加上圆点的
var imgWidth=15;  //图像宽
var imgHeight=20;  //图像高
var imgFileName=new Array(10); //文件名,不要加扩展名
var CheckCodeStr="";  //存放当前的验证码，可以用来比较
imgFileName[0]="0";
imgFileName[1]="1";
imgFileName[2]="2";
imgFileName[3]="3";
imgFileName[4]="4";
imgFileName[5]="5";
imgFileName[6]="6";
imgFileName[7]="7";
imgFileName[8]="8";
imgFileName[9]="9";

 

function getCheckCode(elementId)  

// 生成验证码，将在Id为elementId的HTML元素的innerHTML中写入HTML图片源码
{
    htmlStr = "" ;
    CheckCodeStr = "" ;  // 清空原验证码
     for  (i = 0 ;i < 4 ;i ++ )
    {
        num = Math.round(Math.random() * 10 - 0.5 );
        CheckCodeStr += num.toString();
        filePath = imgFolderPath + imgFileName[num] + fileExt;
        htmlStr += " <img border=0 width=@width@ height=@height@ alt=''点击更换一组验证码'' src=''@src@'' onclick=''getCheckCode( " @elementid @" )'' style=''cursor:hand''> " ;
        htmlStr = htmlStr.replace( " @width@ " ,imgWidth);
        htmlStr = htmlStr.replace( " @height@ " ,imgHeight);
        htmlStr = htmlStr.replace( " @src@ " ,filePath);
        htmlStr = htmlStr.replace( " @elementid@ " ,elementId);
    }
    document.getElementById(elementId).innerHTML = htmlStr;
}

 

function CheckCodeOK(str)
{

if  (str == CheckCodeStr)
    {
         return   true ;
    }
     else
    {
         return   false ;
    }
}
 

 

test.html

 

 

< script language = javascript src = CheckCode.js ></ script >

 

 

< body onload = " getCheckCode(''CheckCodeImg'') " >

 

 

< div id = " CheckCodeImg " >   <!-- 验证码图片出现在此处 --></ div >

 

 

< input type = button value = " Click Me "  onclick = " getCheckCode(''CheckCodeImg'') " >< br >< br >
< input type = text name = " CheckCode " >
< input type = button value = " Check "  onclick = " if (CheckCodeOK(document.getElementById(''CheckCode'').value)){alert(''OK'');}else {alert(''error'')} " >

 

 

</ body >

 

摘自 http://www.cnblogs.com/spark_wu/articles/1377402.html