{
    分享网正式开通,我们为大家提供免费资源,欢迎大家踊跃投稿!

5款实用的jQuery验证码插件

5款实用的jQuery验证码插件分享给大家,分别有普通字母数字验证码、运算验证码、滑动验证码、点选验证码,纯前端的网页验证码代码。


js代码

<script type="text/javascript" src="js/verify.js" ></script>
<script type="text/javascript">
	$('#mpanel2').codeVerify({
		type : 1,
		width : '400px',
		height : '50px',
		fontSize : '30px',
		codeLength : 6,
		btnId : 'check-btn',
		ready : function() {
		},
		success : function() {
			alert('验证匹配!');
		},
		error : function() {
			alert('验证码不匹配!');
		}
	});
	
	
	$('#mpanel3').codeVerify({
		type : 2,
		figure : 100,	//位数,仅在type=2时生效
		arith : 0,	//算法,支持加减乘,不填为随机,仅在type=2时生效
		width : '200px',
		height : '50px',
		fontSize : '30px',
		btnId : 'check-btn2',
		ready : function() {
		},
		success : function() {
			alert('验证匹配!');
		},
		error : function() {
			alert('验证码不匹配!');
		}
	});
	
	
	
	$('#mpanel1').slideVerify({
		type : 1,		//类型
		vOffset : 5,	//误差量,根据需求自行调整
		barSize : {
			width : '80%',
			height : '40px',
		},
		ready : function() {
		},
		success : function() {
			alert('验证成功,添加你自己的代码!');
			//......后续操作
		},
		error : function() {
//		        	alert('验证失败!');
		}
		
	});
	
	
	$('#mpanel4').slideVerify({
		type : 2,		//类型
		vOffset : 5,	//误差量,根据需求自行调整
		vSpace : 5,	//间隔
		imgName : ['1.jpg', '2.jpg'],
		imgSize : {
			width: '400px',
			height: '200px',
		},
		blockSize : {
			width: '40px',
			height: '40px',
		},
		barSize : {
			width : '400px',
			height : '40px',
		},
		ready : function() {
		},
		success : function() {
			alert('验证成功,添加你自己的代码!');
			//......后续操作
		},
		error : function() {
//		        	alert('验证失败!');
		}
		
	});
	
	
	
	$('#mpanel5').pointsVerify({
		defaultNum : 4,	//默认的文字数量
		checkNum : 2,	//校对的文字数量
		vSpace : 5,	//间隔
		imgName : ['1.jpg', '2.jpg'],
		imgSize : {
			width: '600px',
			height: '200px',
		},
		barSize : {
			width : '600px',
			height : '40px',
		},
		ready : function() {
		},
		success : function() {
			alert('验证成功,添加你自己的代码!');
			//......后续操作
		},
		error : function() {
//		        	alert('验证失败!');
		}
		
	});
	
	$('#mpanel6').pointsVerify({
		defaultNum : 4,	//默认的文字数量
		checkNum : 2,	//校对的文字数量
		vSpace : 5,	//间隔
		imgName : ['1.jpg', '2.jpg'],
		imgSize : {
			width: '600px',
			height: '200px',
		},
		barSize : {
			width : '600px',
			height : '40px',
		},
		ready : function() {
		},
		success : function() {
			alert('验证成功,添加你自己的代码!');
			//......后续操作
		},
		error : function() {
//		        	alert('验证失败!');
		}
		
	});
	
	
</script>


在线预览
资源均来自第三方,谨慎下载,前往第三方网站下载


米微资源分享网 , 版权所有丨本站资源仅限于学习研究,严禁从事商业或者非法活动!丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:5款实用的jQuery验证码插件
喜欢 ()分享 (0)