js六位数字框自动跳格

所属分类:输入-验证,通用输入

 8926  149  查看评论 (18)
分享到微信朋友圈
X
js六位数字框自动跳格 ie兼容11

更新时间:2020-02-04 00:51:46

更新说明:针对于 IOS 用户 , 支持了自动填充验证码功能,由于各方浏览器兼容性以及潜在的安全性问题,此功能需要满足以下条件。

1.填充验证码位数必须等于组件内置的验证码数组位数。

2.目前在真机 iPhone X中,针对于Safari,Chrome,测试正常,其他浏览器未经测试。

Ps:欢迎反馈BUG。


更新时间:2020-01-15 23:37:08

更新说明:修复了部分样式 ,增强了部分功能,提高了易用度。
新增对象  verifyCodeDOMUtil  , 可以直接调用buildCodeModule方法生成HTML结构。
在回调函数中新增一个实体参数 , that , 它是引用到verifyCode对象中 that。
如果手机端样式排除出现异常 , 请确认一下样式是否被应用。

box-sizing: border-box;padding: 0;margin: 0;

使用方法

1:调用  verifyCode.init(HTML结构的ID) 对组件进行初始化。

2:将你的回调函数赋值给 verifyCode.onFinish。

注意:

你的回调函数中的this指向于verifyCode

请将你的回调函数加入Value 形参 , 这个参数是组件返回给你的输入完成值。

如果你想在你的回调函数完成之后再次使用数字组件框, 请调用 :this.reset()

示例页面最下方中的 SCRIPT标签 中的有代码可供你参考。

默认样式只有 6 个输入框 , JS不受个数的影响 , 如果你有特殊要求,可以自行修改样式于结构 , 在修改前,请确保按照实例页面中的结构与样式的规范来。

3:支持手机端,支持粘贴操作 , 只支持数字输入。

相关插件-验证,通用输入

jQuery表单提交验证verify

一整套注册验证,可直接用于实际项目中
  验证
 93537  1319

jQuery图片滑块验证(附注释)

jQuery拖拽拼图滑块验证
  验证
 12178  162

jQuery注册表单验证

jQuery常见注册表单 包括表单验证、生日选择、邮箱自动补全、密码可见性与重复密码的验证等
  验证
 54352  506

jQuery常用网站表单验证

可用于用户注册,网站留言等,有正在输入提示和失去焦点自动正则验证输入框内容
  验证
 30659  299

讨论这个项目(18)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    姚展锋 0
    2020/8/31 19:28:44
    非常不错的插件,但是移动端未能兼容 回复
    默丶 0
    2020/8/19 11:35:34
    不过安卓下不能自动跳格 希望作者尽快修复 感谢 回复
    默丶 0
    2020/8/19 11:33:25
    试用了很不错 配合google authenticator感觉很完美 2FA功能的绝配
        Enchanter0
        2020/8/19 17:14:29
        收到你的评价很开心,近期准备更新以修复缺陷!
    回复
    喂! 0
    2020/8/13 16:37:20
    显示是点的密码样式好一点
    回复
    zhou小白猪 0
    2020/6/29 10:31:44
    你好 在安卓无法自动格
        Enchanter0
        2020/6/29 15:33:53
        收到问题,近期准备更新 :)
        zhou小白猪0
        2020/6/30 15:40:41
        大佬 你发现问题在哪里了吗 卡住了 求救
    回复
    王老急 0
    2020/6/19 10:21:18
    支持输入x吗?身份证的话需要这个字母啊 回复
    I 0
    2020/5/27 12:42:08
    你好,ios微信浏览器,验证码自动填充不能用,怎么办
        Enchanter1
        2020/5/27 16:13:40
        你好,自动填充兼容性比较低(因为接口标准没有统一),后期会着手完善这个问题 :)
        BattleofLexington0
        2020/5/27 16:20:41
        自动填充是对单个输入框,这里用的是多个不好操作吧。
    回复
    随缘 0
    2020/5/11 21:33:41
    手机上无法跳格
        Enchanter0
        2020/5/12 7:34:49
        你好,具体是什么型号,浏览器,系统版本呢?
    回复
    Enchanter 0
    2020/3/30 13:19:05
    【新发现的性能问题--重要】
    我是开发者,在 IOS-13.3.1版本中,由于来自这个系统的缺陷,本插件无法正确的兼容这个系统,因插件的核心代码逻辑无法绕过此来自系统的缺陷,所以目前并不打算重写以修复,如果这个系统缺陷仍在之后的版本中未被修复,我会抽出时间重写插件以兼容这个缺陷,非常感谢大家使用这个小插件,你们的喜欢是我前行的动力。 回复
    lengyani 0
    2020/3/29 21:06:00
    能不能做个密码验证,输入真确密码后跳转到别的页面
        Enchanter1
        2020/3/30 13:08:49
        首先很抱歉,这边无法将你所描述的功能附加到这个插件上去。
        建议你可以在“验证成功回调函数”中加入代码以此来响应你所需要的功能 ,具体你可参照源文件中的注释 :)。
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复