1. 程式人生 > >相關登錄隨機驗證碼公共函數

相關登錄隨機驗證碼公共函數

return split can var abcd rec sel 生成 鼠標

function randomCode(){
function rand(){
var str="abcdefghijklmnopqrstuvwxyz0123456789";
var arr=str.split("");
var validate="";
var ranNum;
for(var i=0;i<4;i++){
ranNum=Math.floor(Math.random()*36); //隨機數在[0,35]之間
validate+=arr[ranNum];
}
return validate;
}

/*幹擾線的隨機x坐標值*/
function lineX(){
var ranLineX=Math.floor(Math.random()*90);
return ranLineX;
}

/*幹擾線的隨機y坐標值*/
function lineY(){
var ranLineY=Math.floor(Math.random()*40);
return ranLineY;
}

function clickChange(){
var mycanvas=document.getElementById(‘mycanvas‘);
var cxt=mycanvas.getContext(‘2d‘);
cxt.fillStyle=‘#000‘;
cxt.fillRect(0,0,90,40);

/*生成幹擾線20條*/
for(var j=0;j<20;j++){
cxt.strokeStyle=‘#fff‘;
cxt.beginPath(); //若省略beginPath,則每點擊一次驗證碼會累積幹擾線的條數
cxt.moveTo(lineX(),lineY());
cxt.lineTo(lineX(),lineY());
cxt.lineWidth=0.5;
cxt.closePath();
cxt.stroke();
}
cxt.fillStyle=‘red‘;
cxt.font=‘bold 20px Arial‘;
cxt.fillText(rand(),25,25); //把rand()生成的隨機數文本填充到canvas中
}
clickChange();
/*點擊驗證碼更換*/
var mycanvas=document.querySelector(‘canvas‘);
mycanvas.onclick=function(e){
e.preventDefault(); //阻止鼠標點擊發生默認的行為
clickChange();
};

}

相關登錄隨機驗證碼公共函數