简易的验证码功能

今天是要做自己的商城系统的，登录页想弄个验证码，一开始没头绪去网上找了一些看，发现都好麻烦，不适合我这类入门级菜鸟看，于是综合看的几个例子自己写了一个。相对来说比较浅显易懂，适合学习。高手绕道哈哈哈

html代码：

 <input id="t1" type="text" name="u" placeholder="验证码" onblur="but()" />
         <span id="yzm" onclick="createcode()"></span>

js代码：

  <script>
         	window.onload=function(){
  createcode();     //防止首次进入页面不显示验证码，在页面加载就执行这个函数
}
	function createcode(){
					//创建验证码函数
var code; //在全局 定义验证码
code = "";
 var codeLength =4;//验证码的长度
 var selectChar = new Array(2,3,4,5,6,7,8,9,'a','b','c','d','e','f','g','h','i','j','k',
  'm','n','p','q','r','s','t','u','v','w','x','y','z');//所有候选组成验证码的字符，当然也可以用中文的 去掉1,l,0,o
 for(var i=0;i<codeLength;i++)
 { 
 var charIndex =Math.floor(Math.random()*32);
 code +=selectChar[charIndex]; 
 }
// 设置验证码的显示样式，并显示
 document.getElementById("yzm").style.fontFamily="Fixedsys"; //设置字体
 document.getElementById("yzm").style.letterSpacing="5px"; //字体间距
 document.getElementById("yzm").style.color="#0ab000"; //字体颜色
 document.getElementById("yzm").innerHTML=code; // 显示
				}
</script>

数组里去掉了 1，l，0,o，因为在页面展示时不易区分

点击验证码就可以刷新了，注释也是很详细了，一起学习