input标签在谷歌浏览器记住密码下的一个自动填充BUG

这是宝宝第一次写博客，是工作中遇到的一些BUG以及解决方案，突然很有成就感，一定要加油！

******************************************这是一条丑陋的分割线**************************************************

Chrome自带记住密码功能，带来了极大方便

但是在点击保存之后，input标签会自动填充所保存的密码，如下图：

而且填充得很乱，密码不一定就会填充在密码框里。解决这一个BUG，可以用下面这个方案：

例如我们有个input标签：

<input type="text" class="demo" id="demo">

首先在这个input标签上面加一个display为none的input标签

<input type="text"style="display: none"><input type="text" class="demo" id="demo">

然后为input加一个autocomplete="off"的属性，此属性是 HTML5 的新属性，自动完成允许浏览器预测对字段的输入，但是只只用于text, search, url, telephone, email, password, datepickers, range 以及 color类型的<input>和<form>，所以如果我们需要一个密码框，需要给input设置一个onfocus="this.type='password'" 

如下：

<input type="text" class="demo" id="demo" style="display: none";><input type="text" class="demo" id="demo" placeholder="请输入密码" autocomplete="off" onfocus="this.type='password'">

结束啦啦啦啦啦~~哟哟哟！周末愉快咯！