1.js验证。
1.
作者:小萧ovo
链接:https://zhuanlan.zhihu.com/p/22949023
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
2.
http://www.ijavascript.cn/yanzheng/index.html
2.js显示倒计时。
<FONT color=#990000 size=3>网站倒计时<b><SPAN id=span_dt_dt></SPAN></b></FONT> <SCRIPT language=javascript> <!-- function show_date_time(){ window.setTimeout("show_date_time()", 1000); BirthDay=new Date("17-5-2010");// today=new Date(); timeold=(BirthDay.getTime()-today.getTime()); sectimeold=timeold/1000 secondsold=Math.floor(sectimeold); msPerDay=24*60*60*1000 e_daysold=timeold/msPerDay daysold=Math.floor(e_daysold); e_hrsold=(e_daysold-daysold)*24; hrsold=Math.floor(e_hrsold); e_minsold=(e_hrsold-hrsold)*60; minsold=Math.floor((e_hrsold-hrsold)*60); seconds=Math.floor((e_minsold-minsold)*60); span_dt_dt.innerHTML=""+daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒"+"" ; } show_date_time(); //--> </SCRIPT>
3.js写页面验证码
<html>
<head>
<title>registration</title>
<link href="mywork.css" rel="stylesheet" type="text/css">
<meta charset="utf-8">
<script>
var Checking = {};
Checking = {
$ : function(id) {
return document.getElementById(id);
},
color : ['#FF0000', '#00FF66', '#FFFF00', '#FFCC00', '#6600FF', '#0000FF','#99FFFF', '#66CCFF'],
cacheValue : null,// 缓存画布上的值,比对时用
draw : function() {
var div = this.$('ieContainer'), sty = div.style;
div.onselectstart = new Function("return false");// 禁止选中
div.oncopy = new Function("return false");// 禁止复制
sty.height = "26px";
sty.width = "64px";
var bgColor = this.getRandomColor();// div背景色
sty.backgroundColor = bgColor;
sty.font = "15pt Kristen ITC"; //Calibri
var fontColor = this.getRandomColor();// 文字颜色
sty.color = bgColor == fontColor ? this.getRandomColor() : fontColor;// 保证文字色基本不会跟背景色一样
sty.textAlign = "center";
// 设置div颜色渐变效果
sty.filter = "progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr= "
+ bgColor + ", EndColorStr= " + this.getRandomColor() + ")";
var newText = this.getRandomDigit_Letters(5);
this['cacheValue'] = newText;// 临时存贮生成的验证码,校验时使用
div.innerHTML = newText;
},
//画背景
//createLinearGradient() 方法创建一条线性颜色渐变。返回一个线性颜色渐变的一个 CanvasGradient对象。
drawBgColor : function(context) {
var grd = context.createLinearGradient(100, 100, 70, 18);
var startColor = this.getRandomColor();
var endColor = this.getRandomColor();
grd.addColorStop(0, startColor);
grd.addColorStop(1, startColor == endColor
? this.getRandomColor()
: endColor);
context.fillStyle = grd;
context.fillRect(100,100, 800, 600);
},
//画文字
drawText : function(context) {
var x = 60;
var y = 30;
context.font = "30pt Kristen ITC";
context.textAlign = "center";
context.fillStyle = this.getRandomColor();
var newText = this.getRandomDigit_Letters(5);
this['cacheValue'] = newText;
context.fillText(newText, x, y);
},
//获得随机颜色
getRandomColor : function() {
var len = this.color.length, random = this.getBigRandom(len);
return this['color'][random];
},
//根据scale以内的随机整数
getBigRandom : function(scale) {
return Math.floor(Math.random() * (scale || 10));
},
//获得画布上的字符串,字母与数字的随机组合
getRandomDigit_Letters : function(length) {
var result = [];
var arr = this.getLetters().concat(this.getDigit());
for (var i = 0; i < length; i++) {
result.push(arr[this.getBigRandom(35)]);
}
return result.join("");
},
//获得0~9的数组
getDigit : function() {
var arr = [];
for (var i = 0; i < 10; i++) {
arr.push(i);
}
return arr;
},
//获得a~z的字母数组
getLetters : function() {
var arr = [];
var start = "a".charCodeAt();
var end = "z".charCodeAt();
for (var i = start; i <= end; i++) {
if (i % 2 == 0) {
arr.push(String.fromCharCode(i));
} else {
arr.push(String.fromCharCode(i).toUpperCase());
}
}
return arr;
},
// 判断
check : function()
{
var chkValue = this['cacheValue'].toUpperCase();
var inputValue = this.$('chk').value.toUpperCase();
if (chkValue !== inputValue)
{
alert("验证码输入错误!");
return false;
}
else
return true;
}
}
</script>
<body onLoad="Checking.draw()">
验证码:
<div id="ieContainer" onClick="Checking.draw()">
</div>
<br/>
<input type='text' id="chk">
<br>
</br>
<input type="submit" value="提交" name="submit" οnclick="Checking.check()" >
</body>
</htm
l>