没想到再次打开blog已经是11月份的尾巴了，说来惭愧，最近发生的事情太多了，整个人的都蒙圈了。先是工作上的忙碌，还有生活的一些事情，总之在打开写已经两个月过去了.今天偶得闲暇，有碰到了一个很久以前就遇到过的小问题，通过查找资料，自测试，最终在知乎上找到了解决方法。先抛出我的问题，浏览器的保存密码大家都不陌生吧，但是你应该也碰到过在你注册某个网站时会看到不想要自动填充的地方，填充了你的账号和密码，例如下面的栗子：

先说一下浏览器这个自动填充的原理吧。浏览器保存的用户名会和密码会找到页面结构中的type值为password的input标签，然后把值进行填充。提到表单的自动填充大家很容易想到autocomplete这个属性，但是这个属性的兼容性问题太严重，方案给予排除在外。

方案一：增加隐藏域

增加隐藏域即是增加type为password的input标签，样式设为display:none

1

<input type="password" style="display:none" />

让浏览器的密码填充到这个隐藏的表单里面，自生自灭。
(修正：display并没有卵用,也许是环境的问题，后来改成了如下方式，为了不影响布局，给予了固定定位。)

1
2

<input type="text" style="visibility:hidden;position:fixed;float:left;width:0px;height:1px;" />
<input type="password" style="visibility:hidden;position:fixed;float:left;width:0px;height:1px;"  />

方案二：动态改变type值

动态改变type值即页面加载时不要有password，当页面加载完成时，给要改变的input增加onfoucs事件。据说ie8不允许改变input的type，还没有亲测。等测完再来斧正。
亲测，ie8真的没有办法动态改变input的type属性，蛋疼的ie。

1
2
3
4
5
6

<!--[if ie 8 ]>
<style>
  .text_password{display:none}
</style>
<input id="password" type="password" class="text_password" name="password" placeholder="{{i18n "Password" bundle="user"}}" pattern="[\s\S]{6,16}" required>
<![endif]-->

ie8下我要执行这个input，非ie8下执行以前的，发现！ie 8 只在ie下才能起作用。所以只能采用增加样式display：none来解决了。这样虽然是解决了样式的问题，但是提交的时候又比较麻烦了，然后一个坑接着另一个坑，最终我选择了方案一的修正方案。
参考文章知乎：怎么禁止自动填充浏览器记住的密码