禁用表单自动填写功能在Chrome没有禁用自动完成 [英] Disable form autofill in Chrome without disabling autocomplete

问题描述

我们如何禁用某些Chrome的自动填充功能＆LT;输入＆GT; s至prevent它们被自动填充在页面加载时

How can we disable Chrome's autofill feature on certain <input>s to prevent them from being automatically populated when the page loads?

同时我需要保持启用自动完成的，因此用户仍然可以看到的建议列表通过点击它的输入或输入。可以这样做？

At the same time I need to keep autocomplete enabled, so the user can still see the list of suggestions by clicking on the input or typing in it. Can this be done?

编辑：随意使用纯JavaScript或jQuery的，如果你觉得有必要，或者你觉得它会使您的解决方案更简单

Feel free to use plain Javascript or jQuery if you feel it is necessary or you feel like it would make your solution simpler.

推荐答案

有点晚了，但这里对于像注册/登记页面，用户必须输入新密码的页面用我的傻瓜证明的解决方案。

A little late, but here's my fool proof solution useful for pages like the sign up/registration page where the user has to input a new password.

<form method="post">
    <input type="text" name="fname" id="firstname" x-autocompletetype="given-name" autocomplete="on">
    <input type="text" name="lname" id="lastname" x-autocompletetype="family-name" autocomplete="on">
    <input type="text" name="email" id="email" x-autocompletetype="email" autocomplete="on">
    <input type="password" name="password" id="password_fake" class="hidden" autocomplete="off" style="display: none;">
    <input type="password" name="password" id="password" autocomplete="off">
</form>

Chrome浏览器会检测两个密码输入，并且不会自动填写密码字段。但是，字段id =password_fake一会可以通过CSS隐藏。因此，用户将只能看到一个口令字段。

Chrome will detect two password inputs and will not auto fill the password fields. However, the field id="password_fake" one will be hidden via CSS. So the user will only see one password field.

我还添加了一些额外的属性，X-autocompletetype，这是一个实验性的镀铬特定的自动填充功能。从我的例子中，Chrome将在头名自动填充，最后的姓名和电子邮件地址，并没有密码字段。

I've also added some extra attributes "x-autocompletetype" which is a chrome experimental specific auto fill feature. From my example, chrome will autofill in the first name, last name and email address, and NOT the password field.

这篇关于禁用表单自动填写功能在Chrome没有禁用自动完成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！