禁止浏览器自动填充密码

浏览器记住密码功能原本是个好功能，然而也可能带来一些意外情况。例如控件自身与内容不匹配，本来不需要值的隐藏控件被填充了值导致提交的数据错误等。如何(文章标题)? 归根结底，浏览器保存密码是根据input=”password”来判断的，所有我们只要保证浏览器在dom结构中识别不到密码框即可。

以下为知乎网友提供的2种方案

• 监听事件

–>密码输入位置默认为input=”text”。
–>在输入框上添加 οnfοcus=”this.type=’password’” 输入框获得焦点时改变输入框格式为密码框
–>输入密码
–>在提交前清空输入框密码，并修改密码框为文本框。（我的提交为发生Ajax提交，可根据自己实际情况进行调整，或者情况密码之后，将值保存在一个隐藏域中，再提交表单）

• 利用隐藏控件

先输入一个隐藏文本域，再输入第二个展示的文本框，重点是我加黑的字体，编译器可能会无法识别，但是浏览器可以解析。

笔者提供一个比较笨的方案

<input type="text" id="username"><input type="password" id="password">
window.onload(function(){
    document.getElementById("password").type = "text";
    setTimeout(function(){
        document.getElementById("password").type = "password";
    }, 300);
})