原网址 ：http://blog.csdn.net/imdennisleung/article/details/51220387
在浏览器中提交表单后，浏览器一般会提示“是否需要记住密码”，确认后在下次提交表单的时候会自动填充某些输入框。
但是在某些情景下（例如在提现，充值的页面），自动填充密码就很不安全。需要采用一定的手段来阻止浏览器自动填充。
在解决的过程中遇到了一些坑，这里做一下笔记：
使用HTML属性 autocomplete="off"
由于自动填充这个特性是浏览器自己实现的，autocomplete这个属性也没有被写入W3C规范。很多浏览器都会直接忽略这个属性。无法禁用自动填充。
使用js在页面加载的时候设置input的value为空
很自然能想到的一个办法，但是浏览器的自动填充居然是在js执行完后再填充的。。。在使用js设置了input的value为空后，浏览器又把input自动填充，无法解决问题。
增加<input type=”password”/>
网上流传甚广的一个方法。这个方法在大部分版本的浏览器上是可行的，但是在某些高版本的浏览器和Safari中失效。后面介绍的几种方法都是基于这个方法的改进。
<!-- 额外增加的input -->
<input type="password" style="display:none"/>
<!-- 原先的input -->
<input type="password"/>- 1
- 2
- 3
- 4
- 1
- 2
- 3
- 4
增加form
这个方法较上面那个解决了Safari下自动填充的问题。但是在某些高版本Chrome下失效。（经测试Chrome 46.0可行，Chrome 47.0失效）
<!-- 额外增加的form和input -->
<form style="display:none">
<input type="password"/>
</form>
<!-- 原先的input -->
<input type="password"/>- 1
- 2
- 3
- 4
- 5
- 6
- 1
- 2
- 3
- 4
- 5
- 6
最终解决方案
这个方案结合了上面两种方法，最终连Chrome 47.0下自动填充的问题也解决掉。
<!-- 额外增加的内容 -->
<form style="display:none">
<input type="password"/>
</form>
<input type="password" style="width:0;height:0;float:left;visibility:hidden"/>
<!-- 原先的input -->
<input type="password"/>- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 1
- 2
- 3
- 4
- 5
- 6
- 7
这个方法中需要注意的是与目标input同辈的input不能设置成 display:none，如果设置后再Chrome 47.0上会自动填充，因此只能使用其他手段把这个input隐藏。
Summary
使用了最后一种方案后在各个浏览器中运行良好
----------------------------------------------------------------------------------------------------------------------------