主要介绍了js仿支付宝填写支付密码效果实现多方框输入密码的功能，感兴趣的小伙伴们可以参考一下

主要为大家详细介绍了js仿支付宝多方框输入支付密码效果,具有一定的参考价值，感兴趣的小伙伴们可以参考一下

上次看到别人说写一个类似支付宝支付密码的输入框效果，今天就想自己写了试试看，大体功能是实现了。 已实现部分： 1. 焦点会随着输入数值往后推移 2. 如果输入的非0-9，则会出现提示 3. 按Backspance回车可以对应格子焦点往前推移 4. 按回车或者点击按钮可以触发按钮点击事件，获得输入值 未完善部分： 1. 在控制输入类型的时候，只有0-9、非0-9以及回车、回删几个键盘事件的区分，不够完善 2. 输入框用的input标签，password类型，会将输入值变成圆点，但是圆

不知道怎么描述标题，先看截图吧，大致的效果就是一个框输入一位密码。 最开始实现的思路是一个小方框就是一个type为password的input，每输入一位自动跳到下一位，删除一位就自动跳到前一位，android上是OK的，很平滑也没有bug，但是ios上会出现键盘频繁调起和关闭，非常影响用户体验。原因估计是每个input会不断的focus和blur，每次focus会调起键盘，blur又会关闭键盘，so….此方案肯定不行了。 PM非要实现这种效果，木有办法~拗不过，一句用户体验不好会让你没话说，