jquery对6格密码框的处理

需求：

 

 

h5页面：

<h3>
    信用支付
    <span class="creditEnough">信用剩余额度：<i class="creditLeft"></i></span>
    <span class="creditShort" style="display: none"><i>剩余信用额度不足，请更换其他方式付款</i></span>
</h3>
<div class="xy-pay-1">
    <span>请输入6位支付密码</span>
    <div class="xy-pay-input clearfiex">
        <input type="password" data-index="0" autocomplete="off" readonly onfocus="this.removeAttribute('readonly')"/>
        <input type="password" data-index="1" autocomplete="off" readonly onfocus="this.removeAttribute('readonly')"/>
        <input type="password" data-index="2" autocomplete="off" readonly onfocus="this.removeAttribute('readonly')"/>
        <input type="password" data-index="3" autocomplete="off" readonly onfocus="this.removeAttribute('readonly')"/>
        <input type="password" data-index="4" autocomplete="off" readonly onfocus="this.removeAttribute('readonly')"/>
        <input type="password" data-index="5" autocomplete="off" readonly onfocus="this.removeAttribute('readonly')"/>
    </div>
    <input class="zf" type="button" name="" id="ljzf" value="立即支付" onclick="doCreditPay()" />
</div>

 

js处理：

$(".xy-pay-input input").on('input',function(e){
        // 拿到对象，以及输入的值
        //console.log($(this).data("index"),e.target.value);
        var index = $(this).data("index");
        var value = e.target.value.substr(0,1);
        $(this).val(value);
        pwd[index] = value;
        if(index<5){
            $(this).next().focus();
        }else{
            $(this).focus();
        }
});
$(".xy-pay-input input").on('keyup',function(e){
        if(e.keyCode === 8) {
            var index = $(this).data("index");
            pwd[index] = "";
            if(index>0){
                $(this).prev().focus();
            }else{
                $(this).focus();
            }
        }
});