jquery实现登录失败提示_浅谈jQuery的verify验证码
verify.js是一款功能強大的jquery驗證碼插件。verify.js可以實現普通的圖形驗證碼，數字驗證碼，滑動驗證碼和點選驗證碼等多種驗證碼功能。
1、普通驗證碼
就是所有英文字母和數字的組合，可以隨意設置組合的位數
普通驗證碼
確定
$('#mpanel2').codeVerify({
type : 1,
width : '400px',
height : '50px',
fontSize : '30px',
codeLength : 6,
btnId : 'check-btn',
ready : function() {
},
success : function() {
alert('驗證匹配！');
},
error : function() {
alert('驗證碼不匹配！');
}
});
2、數字計算驗證碼
算法，支持加減乘，不填為隨機，僅在type=2時生效
$('#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('驗證碼不匹配！');
}
});
3、滑動滑塊到最右側完成驗證
$('#mpanel1').slideVerify({
type : 1, //類型
vOffset : 5, //誤差量，根據需求自行調整
barSize : {
width : '80%',
height : '40px',
},
ready : function() {
},
success : function() {
alert('驗證成功，添加你自己的代碼！');
//......后續操作
},
error : function() {
//alert('驗證失敗！');
}
});
4、拖動方塊到空白處完成驗證(圖片)
$('#mpanel4').slideVerify({
type : 2, //類型
vOffset : 5, //誤差量，根據需求自行調整
vSpace : 5, //間隔
imgName : ['1.jpg', '2.jpg','3.jpg','4.png','5.jpg'],
imgSize : {
width: '400px',
height: '200px',
},
blockSize : {
width: '40px',
height: '40px',
},
barSize : {
width : '400px',
height : '40px',
},
ready : function() {
},
success : function() {
alert('驗證成功，添加你自己的代碼！');
//......后續操作
},
error : function() {
// alert('驗證失敗！');
}
});
5、點選驗證碼(點擊圖片上的文字 按順序)
$('#mpanel5').pointsVerify({
defaultNum : 4, //默認的文字數量
checkNum : 2, //校對的文字數量
vSpace : 5, //間隔
imgName : ['1.jpg', '2.jpg','3.jpg','4.png','5.jpg'],
imgSize : {
width: '600px',
height: '200px',
},
barSize : {
width : '600px',
height : '40px',
},
ready : function() {
},
success : function() {
alert('驗證成功，添加你自己的代碼！');
//......后續操作
},
error : function() {
// alert('驗證失敗！');
}
});
完整代碼
jquery驗證碼插件verify.js
')
普通驗證碼
確定
數字計算驗證碼
確定
滑動驗證碼
滑動滑塊到最右側完成驗證
拖動方塊到空白處完成驗證
點選驗證碼
提示：如果不需要在驗證之后自動刷新驗證碼之后就可以注釋掉verify.js文件的這個方法 this.setCode();
總結
以上是生活随笔為你收集整理的jquery实现登录失败提示_浅谈jQuery的verify验证码的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： python股票数据预处理_Python
- 下一篇： c语言 异或_C语言经典例题来袭！5大方