解决输入框自动填充问题

  很多浏览器不仅仅针对密码输入框(type=password)会有自动填充问题,文本框(type=text)有的也有自动填充问题,如最新的谷歌chrome浏览器,比如很多项目涉及到金额的输入框,会自动将账号填充到金额输入框内。针对这个问题,可以通过js控制真正完美解决,就是稍微比较麻烦,可能会对项目有所影响,所以需要针对实际需求再对自动填充问题是否予以解决。

  输入框有一个readonly属性,可以防止写入,而自动填充是浏览器记住账号密码之后对输入框的一种写入功能,而且是打开页面时的自动写入,这之间需要一定的时间性,所以在浏览器自动写入的这个时间段内将其设置readonly只读,不让其写入,当浏览器自动填充时间段过了,再给予取消readonly即可完美解决浏览器自动填充功能,而且通过实践,0.3秒的时间是不够的,还会被浏览器自动填充,而我们项目是设置了1秒钟的时间,完全可行。

输入框html部分,增加readonly属性

1 <input type="text" readonly="readonly"/>

输入框jquery部分,1秒之后取消readonly属性

1 setTimeout(function(){
2     $("input").removeAttr("readonly");
3 },1000);

 

  写的比较笼统,可以根据实际情况来进行处理,比如专门针对密码输入框的$("input[type='password']").removeAttr("readonly");

posted @ 2021-03-10 11:08  傅丹辰cds  阅读(1568)  评论(0编辑  收藏  举报