使用JS怎样写一个简单的密码验证�

Admin 2022-07-06 群英技术资�

今天这篇我们来学习和了解“使用JS怎样写一个简单的密码验证框”,下文的讲解详细,步骤过程清晰,对大家进一步学习和理解“使用JS怎样写一个简单的密码验证框”有一定的帮助。有这方面学习需要的朋友就继续往下看吧!


本文实例为大家分享了JavaScript实现密码框验证信息的具体代码,供大家参考,具体内容如下

效果展示�

代码展示

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title></title>
  <link rel="stylesheet" type="text/css" href="fontss2/iconfont.css" rel="external nofollow" />
  <style>
   .orginal {
    font-size: 13px;
    color: deepskyblue;
   }
   .wrong {
    font-size: 13px;
    color: red;  
   }
   .right {
    font-size: 13px;
    color: green;
   }
  </style>
 </head>
 <body>
  <p>
   <input type="text"><span class="orginal icon-wenhao iconfont">请输�6-16位密�</span>
  </p>
  <script>
   //获取元素对象
   var input = document.querySelector('input');
   var span = document.querySelector('span');

   // 注册事件 失去焦点事件
   input.onblur = function() {
    if (input.value.length > 0 && input.value.length < 6 || input.value.length > 16) {
     span.className = 'iconfont icon-cuowuguanbiquxiao-xianxingyuankuang wrong';
     span.innerHTML= '输入错误请输�6-16位密�';
    }else if(input.value.length >=6 && input.value.length <=16) {
     span.className = 'iconfont  icon-yiyanzheng  right';
     span.innerHTML = '输入正确';
    }else {
     span.className = 'orginal icon-wenhao iconfont';
     span.innerHTML = '请输�6-16位密�';
    }
   }
  </script>
 </body>
</html>

关于“使用JS怎样写一个简单的密码验证框”就介绍到这了,如果大家觉得不错可以参考了解看看,如果想要了解更多,欢迎关注群英网络,小编每天都会为大家更新不同的知识�
标签� js密码验证�

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:[email protected]进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容�

猜你喜欢

群英网络开启智能安全云计算之旅

注册领取新人大礼�
专业资深工程师驻�
7X24小时快速响�
一站式无忧技术支�
免费备案服务

联系我们

24小时售后 24小时售后TEL�0668-2555666 售前咨询TEL�400-678-4567 投诉建议TEL�0668-2555999 投诉建议邮箱:t[email protected] 信息安全TEL�0668-2555118 域名空间客服 公司总机�0668-2555555 公司传真�0668-2555000
免费拨打  400-678-4567
免费拨打  400-678-4567 免费拨打 400-678-4567 � 0668-2555555
在线客服
微信公众号
返回顶部
返回顶部 返回顶部