本文实例为大家分享了js模拟支付宝密码输入框效果的具体代码,供大家参考,具体内容如
本文实例为大家分享了js模拟支付宝密码输入框效果的具体代码,供大家参考,具体内容如下
效果图:
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<style>
input{
width:60px;
height:60px;
font-size:40px;
line-height: 60px;
}
</style>
<body>
<input type="password"/>
<input type="password"/>
<input type="password"/>
<input type="password"/>
</body>
<script src="jquery-1.11.3.js"></script>
<script>
$(function(){
var ww=2222;//服务器验证码
$('input').eq(0).focus();
$('input').keyup(function(){
if($(this).val().length==1){
$(this).next().focus()
}
})
$('input').eq($('input').length-1).keyup(function(){
var valed=''
for(var i=0;i<$('input').length;i++){
valed=valed+$('input').eq(i).val()
}
if(Number(valed)==ww){
alert('输入正确')
}else{
alert('输入错误')
}
}
)
})
</script>
</html>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
js仿支付宝密码输入框 js支付宝密码输入 js密码输入框