From Jason Hinkle’s Blog
This is a very old article. Again I should stress that the point of this trick is not to wipe out the saved password for login forms. I use it for registration forms and preferences pages that allow users to change their password. In these cases, auto-filling the password can cause problems for the user. This is not a security fix.
I have a new technique now which is much simpler. Create a hidden “honeypot” password field at the top of your form. Browser auto-complete features will only fill in the first password field that they hit. So, by having a dummy password field at the top of your form, you can trick the browser into filling out that field instead of the real password field. It looks like this:
<!-- honeypot fields -->
<input type="text" style="display: none" id="fakeUsername" name="fakeUsername" value="" />
<input type="password" style="display: none" id="fakePassword" name="fakePassword" value="" />
<!-- real fields -->
<input type="text" id="username" value="" />
<input type="password" id="password" value="" />
— ORIGINAL POST BELOW —
Autocomplete is a nice feature which fills in common form fields automatically for the user. However, in some cases you don’t want this to happen. Some examples could be an account management page where you don’t want the admin password to be auto-filled in when you are creating and managing accounts. Another example is any site that has a “My Account” page with a field allowing you to change your password. Auto-complete can accidentally fill in these fields because it thinks it is a login form.
IE uses a non-standard attribute (autocomplete=”off”) that can be added to an entire form or one specific input control. Besides the fact that this attribute will make your HTML markup fail compliance tests, Firefox seems to consider this tag merely a “suggestion” and will disregard it at times.
In particular, Firefox will *always* populate certain password fields. There is seemingly no way to tell Firefox not to fill in a field if it really wants to do so. This can be a very bad thing if you are dealing with a user preference page or something sensitive where you don’t want autocomplete to ever occur under any circumstance. Setting value=”” is equally worthless because Firefox seems to populate this value just after the page is rendered.
The following code however will work. The concept is basically to set a timeout a fraction of a second after the page loads which clears the password field. Technically Firefox still populates the field, however this script code removes it almost instantly. As an added bonus, because you are not using autocomplete=”off” your HTML markup should still validate. This code should be placed at the bottom of your page beneath your form.
// this brutally clears a password field in firefox
// compliments of verysimple.com
var pw = document.getElementById('MyPasswordFieldName');
if (pw != null)
pw.value = '';
This code could probably be made more generic by enumerating through the form elements and searching for a certain class name. This way you could have one script and simply append a classname to any field that you don’t want auto-complete to occur. This technique is similar to one posted on Chris Holland’s blog. Chris’s solution, however, is aimed exclusively at the Wc3 compliance issue. As you can see in his code he adds the autocomplete=”off” attribute, which allows the page to validate properly, but doesn’t solve the Firefox/Password field issue.
If you have a more graceful solution and/or decide to flesh this idea out, please post a comment and I’ll provide a link to your site.