【场景】注册页面form表单顺序:用户名、验证码、密码、确认密码
【问题】点击提交表单后,浏览器右上角自动记住了验证码和密码,而非用户名和密码
【期望结果】记住用户名和密码
【问题分析】由于浏览器默认记录离input type="password"的上一个input type="text"为用户名,而验证码离密码最近,故导致以上问题
【解决方案】
1.交换验证码和密码输入框的位置,两者外面包一层容器,设置style="display: flex;flex-direction: olumn-reverse;",达到视觉效果的一致性;(这样设置后,会导致输入完用户名后,点击tab键后浏览器光标自动跳至密码输入框,tab点击后,顺序有问题,解决方法见步骤2)
2.给input增加tabindex="1"属性,依次设置用户名、验证码、密码、确认密码的tabindex分别为1、2、3、4,这样,光标顺序就正确了