JS实现密码框效果

2023-07-16 21:47:05 67

在输入密码时，将密码的长度设置为6-16，且在密码长度出现小于6或是大于16时，会出现提示，效果如下图

1.此事件为失去焦点事件，当鼠标离开密码框且点击旁边就会触发事件
2.输入密码会出现提示，事件发生与密码的长度有关
3.根据长度再来判断该提示的消息与效果.

代码如下：







密码框

div{
width:600px;
margin:100pxauto;
}
.massage{
background-image:url(gth.png);
background-repeat:no-repeat;
background-position:leftcenter;
color:black;
display:inline-block;
padding-left:20px;
}
.right{
background-image:url(right.png);
background-repeat:no-repeat;
color:green;
}
.wrong{
background-repeat:no-repeat;
background-image:url(wrong.png);
color:red;
}





请输入6-16位密码

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

JS实现密码框效果

热门推荐

随机推荐