chrome浏览器自动记住账户密码,总存在错位

492 阅读1分钟
项目现状
  1. 登录页面存在用户名密码登录,但在此之间存在图形验证码,导致浏览器自动填充时,出现错位,保存验证码及密码的情况;
    image.pngimage.png
  2. 需要实现用户名和密码的自动填充,分析思路整理解决方案。
解决思路
  1. 观察其他正常【自动填充】用户名密码网站,发现其他的网站没有【图形验证码】这个“第三者”,错位场景完全不存在;
  2. 调整代码中验证码和密码的顺序,是可以正常自动填充的(需求如上图,是圣旨);
  3. 网上查看相对比较靠谱的方案-在input标签上面再写一个input且定位到下方(果然不靠谱啊)参考文献:www.freesion.com/article/263…
  4. 浏览器自动填充的原理:遇到type="text"与type="password"的input标签紧邻时,会触发浏览器自动填充行为;
  5. 结合思路三,那我调整代码顺序:验证码、用户名、密码,我通过定位形式将页面调整满足【需求】,然后又因为用户名和密码紧挨,同时满足浏览器填充原理,成功解决啦!!!! image.png