Отключить автозаполнение формы html

How do you disable browser autocomplete on web form field / input tags?

In some systems where testers have to manually enter a lot of information over and over it might be useful to have the option as configurable so that when testing you can disable it and just hit ‘tab > down arrow > tab > down arrow etc. ‘

Try github.com/terrylinooo/disableautofill.js , it uses JavaScript the skip the auto-fill function from browser.

102 Answers 102

Firefox 30 ignores autocomplete=»off» for passwords, opting to prompt the user instead whether the password should be stored on the client. Note the following commentary from May 5, 2014:

• The password manager always prompts if it wants to save a password. Passwords are not saved without permission from the user.
• We are the third browser to implement this change, after IE and Chrome.

According to the Mozilla Developer Network documentation, the Boolean form element attribute autocomplete prevents form data from being cached in older browsers.

This did not work for me in Firefox 3.0.3 I had to put the autocomplete attribute in the FORM rather than the INPUT.

Autocomplete is only defined in the HTML 5 standards, so it will break any validations you run against HTML 4.*.

@Winston, you should put it both on the form, AND on the input element itself. That way you cover all the nonstandardness of browsers.

And remember to disable your autocomplete = on extension (if you’re using Chrome) before you test your webapp. Else you’ll feel real silly like me. 😉

Surprised, why this answer is accepted and having so much votes. Even there is nothing special as said others. As per my findings most specific and proved solution has provided by @Ben Combee in this thread.

In addition to setting autocomplete=off , you could also have your form field names be randomized by the code that generates the page, perhaps by adding some session-specific string to the end of the names.

When the form is submitted, you can strip that part off before processing them on the server-side. This would prevent the web browser from finding context for your field and also might help prevent XSRF attacks because an attacker wouldn’t be able to guess the field names for a form submission.

This is a much better solution compared to using autocomplete=»off». All you have to do is generate a new name on every page load and save that name to a $_SESSION for future use: $_SESSION[‘codefield_name’] = md5(uniqid(‘auth’, true));

No, this is not a better solution, because the origin of preference for this setting is user agent also known as the web browser. There is a difference between supporting certain behaviour (which HTML 5 attempts to do) and forcing it by deciding on behalf of the user, which you suggest is a «much better solution».

This solution can work with all browsers, so in that respect it is «better». Still, amn is correct, deciding to disable autocomplete on behalf of your users is not a good idea. This means I would only disable autocomplete in very specific situations, such as when you plan to build your own autocomplete functionality and don’t want conflicts or strange behavior.

Regarding XSRF attacks, I’m not sure what type of attack you were picturing, but couldn’t the attacker just strip off the end part the same way you do server-side to identify the fields? Or if the attacker is posting the fields, couldn’t they append their own random string since it’ll be stripped off by the server?

@macguru2000 building your own autocomplete is a completely legit and common use-case. Really the browser should make it easier for developers to turn off autocomplete when they need to instead of forcing us to use hacks like this one

Most of the major browsers and password managers (correctly, IMHO) now ignore autocomplete=off .

Why? Many banks and other «high security» websites added autocomplete=off to their login pages «for security purposes» but this actually decreases security since it causes people to change the passwords on these high-security sites to be easy to remember (and thus crack) since autocomplete was broken.

Long ago most password managers started ignoring autocomplete=off , and now the browsers are starting to do the same for username/password inputs only.

Unfortunately, bugs in the autocomplete implementations insert username and/or password info into inappropriate form fields, causing form validation errors, or worse yet, accidentally inserting usernames into fields that were intentionally left blank by the user.

What’s a web developer to do?

• If you can keep all password fields on a page by themselves, that’s a great start as it seems that the presence of a password field is the main trigger for user/pass autocomplete to kick in. Otherwise, read the tips below.
• Safari notices that there are 2 password fields and disables autocomplete in this case, assuming it must be a change password form, not a login form. So just be sure to use 2 password fields (new and confirm new) for any forms where you allow
• Chrome 34, unfortunately, will try to autofill fields with user/pass whenever it sees a password field. This is quite a bad bug that hopefully, they will change the Safari behavior. However, adding this to the top of your form seems to disable the password autofill:

I haven’t yet investigated IE or Firefox thoroughly but will be happy to update the answer if others have info in the comments.

Источник

How to turn off form autocompletion

This article explains how a website can disable autocomplete for form fields.

These features are usually enabled by default, but they can be a privacy concern for users, so browsers can let users disable them. However, some data submitted in forms either are not useful in the future (for example, a one-time pin) or contain sensitive information (for example, a unique government identifier or credit card security code). As website author, you might prefer that the browser not remember the values for such fields, even if the browser’s autocomplete feature is enabled.

Note that the WCAG 2.1 Success Criterion 1.3.5: Identify Input Purpose does not require that autocomplete/autofill actually work — merely that form fields that relate to specific personal user information are programmatically identified. This means that the criterion can be passed (by adding the relevant autocomplete attributes to individual form fields) even when autocompletion for the form itself has been turned off.

Disabling autocompletion

To disable autocompletion in forms, you can set the autocomplete attribute to «off»:

You can do this either for an entire form, or for specific input elements in a form:

form method="post" action="/form" autocomplete="off"> … form> 

form method="post" action="/form"> … div> label for="cc">Credit card:label> input type="text" id="cc" name="cc" autocomplete="off" /> div> form> 

Setting autocomplete=»off» on fields has two effects:

• It tells the browser not to save data inputted by the user for later autocompletion on similar forms, though heuristics for complying vary by browser.
• It stops the browser from caching form data in the session history. When form data is cached in session history, the information filled in by the user is shown in the case where the user has submitted the form and clicked the Back button to go back to the original form page.

If a browser keeps on making suggestions even after setting autocomplete to off, then you have to change the name attribute of the input element.

The autocomplete attribute and login fields

Modern browsers implement integrated password management: when the user enters a username and password for a site, the browser offers to remember it for the user. When the user visits the site again, the browser autofills the login fields with the stored values.

Additionally, the browser enables the user to choose a master password that the browser will use to encrypt stored login details.

Even without a master password, in-browser password management is generally seen as a net gain for security. Since users do not have to remember passwords that the browser stores for them, they are able to choose stronger passwords than they would otherwise.

For this reason, many modern browsers do not support autocomplete=»off» for login fields:

Preventing autofilling with autocomplete=»new-password»

If you are defining a user management page where a user can specify a new password for another person, and therefore you want to prevent autofilling of password fields, you can use autocomplete=»new-password» .

This is a hint, which browsers are not required to comply with. However modern browsers have stopped autofilling elements with autocomplete=»new-password» for this very reason. For example, Firefox version 67 (see Firefox bug 1119063) stopped autofilling in this case; however, Firefox 70 (see Firefox bug 1565407) can suggest securely-generated passwords, but does not autofill a saved password. See the autocomplete compat table for more details.

Found a content problem with this page?

This page was last modified on Jul 4, 2023 by MDN contributors.

Источник

Как отключить автозаполнение форм с помощью html 5?

Ничего не получается. На поле всё равно срабатывает авто заполнение.
Что я делаю не так?

UPD.

Оценить 1 комментарий

Миржалол Мирхомитов, Гениально! 04.09.2021 всё работает.
chrome Версия 92.0.4515.159 (Официальная сборка), (64 бит)
такие дела))

14.10.2021. Chrome Версия 94.0.4606.81 (Официальная сборка), (64 бит) до сих пор работает)

Очень простой и изящный способ как отключить автозаполнения и выпадающие списки с выбором логина и пароля от браузера на формах регистрации и прочих формах.

здесь мы отключаем автозаполнение пароля, а также чтобы не было выпадающего списка выбором паролей там где это не нужно:
— оборачиваем форму в блок со свойством position:relative
— после поля прописываем блок с position:absolute top:0 left:0 width:100% height:100%
— создаем событие onclick, для класса field где вызываем фокус для нашего поля внутри

До

После

Евгений Коелсник, akb2.
Можете подсказать, пж?
Я не совсем понял как нужно сделать, чтобы не было выпадающего списка выбором паролей.

Можно отключить автозаполнение, если в момент фокусировки в поле поменять у поля значение name на произвольное. А когда пользователь выходит из input, то поменять значение name обратно. В этом случае браузер Хром не выводит подсказок, т.к. каждый раз значение name новое.
Необходимо подключать jquery, а ниже подключить сам скрипт.

Исходник (взял отсюда только код, который генерит значение name) https://github.com/terrylinooo/jquery.disableAutoFill

Это сама форма, показываю кусок формы, с полями ввода, для которых отключаю подсказки хрома. Оба инпута имеют класс «only-ru»:

Сам скрипт, который при фокусе генерит произвольное значение для name, а при выходе из фокуса — возвращает значение name обратно, как мне нужно. Можете его улучить, сделать более универсальным:

//поменять name при фокусе $('.only-ru').on("focus", function()< var realFields = []; var realFieldsMapper = <>; $(this).each(function(i) < realFields[i] = $(this).attr('name'); if(realFieldsMapper[realFields[i]]) < $(this).attr('name', realFieldsMapper[realFields[i]]); >else < var randomName = Math.random().toString(36).replace(/[^a-z]+/g, ''); $(this).attr('name', randomName); realFieldsMapper[realFields[i]] = randomName; >>); >); //поменять name обратно $(document).mouseup(function (e)< var div1 = $("#city1"), div2 = $("#city2"); if (!div1.is(e.target)) $("input#city1").attr('name', 'city1'); if (!div2.is(e.target)) $("input#city2").attr('name', 'city2'); >);

Источник