移动端密码框输入,判断密码输入是否正确

<div class="info">
    <p class="title">添加银行卡</p>
    <p class="remark">请输入支付密码,以验证身份</p>
    <div class="ipts">
       <input type="tel" class="real-ipt">
       <div class="passIpts">
           <input type="password" class="pIpts">
           <input type="password" class="pIpts">
           <input type="password" class="pIpts">
           <input type="password" class="pIpts">
           <input type="password" class="pIpts">
           <input type="password" class="pIpts">
        </div>
     </div>
</div>

 (HTML内容)

.info{
    padding-top:2.6667rem;
}
.info .title{
     padding-bottom:0.6667rem;
     /*30px*/
     line-height:0.8rem;
     /*20px*/
     font-size:0.5867rem;
     text-align: center;
}
.info .remark{
     /*60px*/
     padding-bottom:1.6rem;
     line-height:0.5333rem;
     text-align: center;
}
.info .ipts{
      margin:0 auto;
      position:relative;
      /*120px*/
      width:5.9467rem;
      height:1.0133rem;
      border:1px solid #ddd;
}
.info .ipts>input{
      position:absolute;
      top:0;
      left:0;
      width:100%;
      height:1.0133rem;
      z-index:1;
      opacity: 0;
}
.info .passIpts{
      overflow: hidden;
}
.info .passIpts input{
      width:16.667%;
      height:1.0133rem;
      line-height:1.0133rem;
      text-align:center;
      float:left;
      border-right:1px solid #ddd;
}

  (CSS内容)

    var $input = $(".passIpts input");
    $(".real-ipt").on("input",function(){
        $(this).val($(this).val().replace(/\s/g,""));
        var pwd = $(this).val();
        // console.log($(this).val());
        for (var i = 0, len = $(this).val().length; i < len; i++) {
            $input.eq("" + i + "").val(pwd[i]);
        }
        $input.each(function() {
            var index = $(this).index();
            if (index >= len) {
                $(this).val("");
                // console.log(index);
            }
        });
        if($(this).val().length == 6 ){
            window.location.href=‘addCard.html‘;
        }
    })

  (JS内容)

原文地址:https://www.cnblogs.com/dyy-dida/p/10510494.html

时间: 2024-08-30 07:17:39

移动端密码框输入,判断密码输入是否正确的相关文章

密码框input不允许输入汉字,只可输入数字和字母等

<input class="tele" type="password" name="password" id="password" onkeyup="value=value.replace(/[\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').repl

WPF文本框密码框添加水印效果

WPF文本框密码框添加水印效果 来源: 阅读:559 时间:2014-12-31 分享: 0 按照惯例,先看下效果 文本框水印 文本框水印相对简单,不需要重写模板,仅仅需要一个VisualBrush   和触发器验证一下Text是否为空即可. 上代码: <TextBox Name="txtSerachDataName" Width="120" Height="23" Grid.Column="3" Grid.Row=&q

[WPF]实现密码框的密码绑定

正如绑定TextBox控件的Text属性一样, 我们希望能够将PasswordBox空间的Password属性进行绑定, 比如在MVVM模式中,这似乎是必须的, 但可惜的是, Password属性是不支持绑定的(不是依赖属性, 也没有实现INotifyPropertyChanged). 这可能是出于安全性的考虑. 但在我们的系统为了实现View层密码框中的密码与后台其它层之间的密码属性之间的绑定, 可以采取如下思路: 将密码框的密码和某一个缓冲区进行同步, 缓冲区在和后台进行绑定. 其中密码框与

wordpress登录密码框明文显示最后一个输入的字符

wordpress登录密码框明文显示最后一个输入的字符 (function(a){a.fn.dPassword=function(c){var e={interval:200,duration:1000,replacement:"%u25CF",prefix:"password_",debug:false};var d=a.extend(e,c);var b=new Array();var f=new Array();a(this).each(function(){

WordPress登录框显示/隐藏输入的密码

直接让用户自行根据需要选择是全部隐藏输入的密码,还是全部显示输入的密码. 在全部显示密码框的内容时,用户输错的可能性就大大降低,这也是微软推荐的一种密码框处理方式.效果如下: 今天,我将给大家介绍,在WordPress中如何实现这个的功能,步骤非常简单. 1.添加js 点此下载 需要用到的js,将此js文件放到当前使用主题的根目录下. 2.添加php代码 function ludou_prevue() { wp_enqueue_script("jquery"); wp_enqueue_

在moss 服务器上访问自己的sharepoint 网站,输入用户名密码无效

环境:sharepoint 2007 ,windows server 2003 x64 sp2 该服务器部署了moss 2007 ,客户端访问正常,但在该服务器上访问moss的时候,不断提示需要输入用户名密码,并且输入无效. 根据微软知识库解释:当网站使用集成身份验证并具有映射到本机环回地址的名称时,将出现此问题. 解决办法: 方法 1:禁用环回检查 将 DisableStrictNameChecking 注册表项设置为 1. 有关具体操作方法的更多信息,请单击下面的文章编号,以查看 Micro

WampServer PHP服务配置方法(允许外部访问、phpmyadmin设置为输入用户名密码才可登录等)

WampSever 指的是apache + mySQL + PHP 三合一套装,第一字母W,是指用于windows系统,我用的是2.0f版.用于Linux系统的,是LampSever,第一字母是L.请到官方网站:http://www.wampserver.com/ 下载最新版.下载地址: localhost和127.0.0.1是相同的,都指向本机网站服务器的根目录,比如:我电脑的网站根目录设定为:d:\wamp\www,本文所有用到localhost的地方,都可以用127.0.0.1来代替.可以

sshpass 使Linux可以明文参数输入SSH密码

1. sshpass安装1 2. sshpass的参数1 3. sshpass的使用2 这几天配置一台服务器,在某云平台创建云服务器后,生成了巨长.巨复杂的一串密码,在输入几十次密码后,依然是密码错误.这时候就想如果密码是非交互式输入,可以将密码做为参数或从文件输入就太好了.sshpass就是一款密码输入辅助工具,它可以从命令行明文参数.文件或环境变量中指定密码,从而避免交互式密码输入. l sshpass的安装 l sshpass的参数 l sshpass的使用 1. sshpass安装 首先

关于登录弹层不能成功输入用户名密码的问题

最近在群里发现有人反馈,登录弹层不能成功输入用户名密码的情况,大致看了一下,稍微总结下: 本人遇到的登录不能成功输入用户名密码的情况有两种,一种是定位错误,一种是不能focus 元素,这两者看起来相似,但实际有点区别,下面将详细介绍下: 先说不能focus元素的:举个例子: 像这种点击登录,出来登录弹层的,很容易出现报错,不能focus element ,一下为对应的代码: 定位登录注册输入框都是根据id来的,执行的时候为什么还会提示这个错误呢: 不能focus元素 我们曾经遇到过登录注册的时候