短信验证码
用于验证真实性、防止恶意注册、保护账户安全等作用。
常用场景：需要输入验证码的情况，如：忘记密码、账号认证。
页面验证
何时使用
输入验证码为独立步骤时使用，如：忘记密码。
交互规则
- 点击验证码，调起数字键盘，当用户输入完成后，键盘自动收起。
- 输入验证码后，
下一步按钮才显示高亮状态。 点击重发可重新获取验证码。
表单验证
何时使用
页面填写信息较多时使用，如：账号注册。
交互规则
- 输入手机号后，
获取验证码才显示高亮状态。 - 点击
输入框，键盘显示；点击页面其他位置，键盘收起。 - 点击
获取验证码，切换到60s倒计时。当前状态不可点击，60s 后恢复到获取验证码按钮，则可重新发送短信验证码。 - 当前页面按钮默认为不可点状态，输入验证码后按钮切换成高亮状态。
弹窗验证
何时使用
- 验证当前页面操作时使用，如：绑定手机号。
- 不打扰用户操作，能快速完成任务，如：绑定手机号。
交互规则
- 点击获取验证码，出现输入验证码弹窗，显示数字键盘；当用户输入完成后，键盘自动收起，并完成校验。
- 60s 倒计时结束后，可再次获取验证码。
设计指南
- 数字框的数量根据需求设定，一般为 4 位或 6 位。
- 注意输入框以及页面按钮的交互状态。
- 可将手机键盘字段记录短信验证码，点击键盘自动填充验证码，做到用户能够更便捷快速的完成操作。
- 验证码最好做到统一类型，便于用户识别，如：全部数字、全部字母(输入时不区分大小写)。