Главная » Языки программирования

Html input отключить автозаполнение chrome

Содержание
  1. niksumeiko / disable-html-form-input-autocomplete-autofill.md
  2. This still working fine for me
  3. This still working fine for me
  4. Как отключить автозаполнение форм с помощью html 5?
  5. Атрибут autocomplete
  6. Кратко
  7. Пример
  8. Как понять
  9. Как пишется
  10. Включение и выключение автозаполнения
  11. Авторизация
  12. Формы имени
  13. Данные банковской карты и деньги
  14. Личные данные
  15. Адрес
  16. Телефон
  17. Ссылки
  18. Подсказки
  19. На практике
  20. Лена Райан советует

niksumeiko / disable-html-form-input-autocomplete-autofill.md

This formation is going to prevent Chrome and Firefox to offer autofill and autocomplete for all input fields inside the form.

the autocomplete=»false» is not working in my case i m using the brave .any suggestion why and how can i disable autocomplete .

This still working fine for me

This still working fine for me

Just autocomplete=»off» is currently working for me; no form element needed. Also changing the id resets the autocomplete list, so you could generate a random id on each render.

autoComplete=»new-password» worked great for me

Making the input type=»search» will eliminate the chrome password suggestions and style=»-webkit-text-security: disc;» will make it look like a type=»password» converting characters into dots.

Couldn’t find any other solution but this works for me.

Personally, it worked for me to aria-autocomplete=»none» in microsoft edge.

@helisoncruz Your solution worked perfect for me

For those who stumbled here like I did many times, this works (at least for now):

You don’t need to delete ID or have dynamic names.

For those who stumbled here like I did many times, this works (at least for now):

You don’t need to delete ID or have dynamic names.

@zmitic You saved my day. Thanks so much 💯

autocomplete=»new-password»
This is the only one that worked.

I have an address input that I could not get rid of the autocomplete no matter what I tried. Eventually I got desperate (corporate overlords breathing down my neck) and, upon noticing that the attribute didn’t show up when I used the dev tools to inspect it, added it via JavaScript:

// vanilla js document.querySelector('input[name="address"]').setAttribute('autocomplete','none'); // jquery $('input[name="address"]').attr('autocomplete','none');

Tested w/ (Windows) Chrome, Edge, Firefox, Opera

autoComplete=’off’ worked like a charm in my next.js thx bud

form autocomplete pl-s">off" method pl-s">post" action=""> input autocomplete pl-s">false" name pl-s">hidden" type pl-s">text" style pl-s">display:none;"> .

works perfect, but it disables autocompletion for the whole form. Did someone find 2023 working solution for a singe field?

works perfect, but it disables autocompletion for the whole form. Did someone find 2023 working solution for a singe field?

nope ;( it doesn’t work for me (Chrome 112)

EDITED:
When I added both role=»presentation» and autocomplete=»off» on the input field, it did work!
In my case it looks like this:

form id pl-s">some_id" method pl-s">post" enctype pl-s">multipart/form-data"> input type pl-s">text" role pl-s">presentation" autocomplete pl-s">off" name pl-s">array[some_array]" value pl-s"> " placeholder pl-s">Placeholder. ">

I write this because I have already noticed before, that in some cases it really matter which combination of attributes, fields, labels, or even divs just before the input field is present. Chromegarbage is smart enough to turn on autocompletion for a field even if there is just a label with some keyword (like «город», which means «city» in Russian), when there is no such keyword, no autocompletion is present.

Maybe we need to ticket a petition or something to make them give us ability to control our html and not to decide instead of us how our forms should behave.

Источник

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

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

702101f4edb640ed8c402ef764f61d36.JPG

UPD.

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

bootd

Mirami97

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

Mirami97

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

mirniycruxix

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

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

5c7b1b5e59913162932758.jpeg

До

5c7b1b47ab6ba995507479.jpeg

После

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

AndrewBoeing

Можно отключить автозаполнение, если в момент фокусировки в поле поменять у поля значение 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'); >);

Источник

Атрибут autocomplete

Как не тратить время на заполнения форм? Доверить всё компьютеру!

Время чтения: меньше 5 мин

  1. Кратко
  2. Пример
  3. Как понять
  4. Как пишется
    1. Включение и выключение автозаполнения
    2. Авторизация
    3. Формы имени
    4. Данные банковской карты и деньги
    5. Личные данные
    6. Адрес
    7. Телефон
    8. Ссылки
    1. Лена Райан советует

    Обновлено 20 декабря 2021

    Кратко

    Скопировать ссылку «Кратко» Скопировано

    Атрибут, при помощи которого форма заполняется в один клик — браузер подставит значения в соответствующие поля.

    Пример

    Скопировать ссылку «Пример» Скопировано

    Создадим форму, в которую пользователь будет сам вводить имя, а при заполнении поля e-mail сможет выбрать адрес почты из предложенных браузером вариантов:

             form action=""> div> label for="name">Введите имяlabel> input id="name" type="text"> div> div> label for="email">Электронная почтаlabel> input id="email" type="email" autocomplete="on"> div> button type="submit">Отправитьbutton> form>

    Как понять

    Скопировать ссылку «Как понять» Скопировано

    Когда вы заполняете формы, браузер сохраняет те или иные данные — логины, пароли, адреса и e-mail. При заполнении очередной формы браузер идёт в список сохранённой информации, выуживает оттуда данные, которые требуются для этой формы, и вставляет в соответствующие поля.

    Как пишется

    Скопировать ссылку «Как пишется» Скопировано

     
    .
          form autocomplete="on">. form>

    Атрибут autocomplete пишется внутри открывающего тега, и в кавычках прописывается его значение.

    В зависимости от значения атрибута autocomplete , будут подставляться данные разного типа. Ниже приведены возможные значения.

    Включение и выключение автозаполнения

    Скопировать ссылку «Включение и выключение автозаполнения» Скопировано

    Авторизация

    Скопировать ссылку «Авторизация» Скопировано

    • nickname — никнейм.
    • username — имя пользователя или название аккаунта.
    • email — адрес электронной почты.
    • current — password — текущий пароль пользователя.
    • new — password — новый пароль.
    • one — time — code — одноразовый код для верификации пользователя.

    Формы имени

    Скопировать ссылку «Формы имени» Скопировано

    • name — полное имя.
    • given — name — имя (в странах, где дают два имени, это первое имя).
    • additional — name — второе имя (для стран, где дают два имени).
    • family — name — фамилия.
    • honorific — prefix — звание или префикс для обращения, например, «Mrs.», «Mr.», «Miss», «Ms.», «Dr.», «Mlle.».
    • honorific — suffix — окончание имени, например, «Jr.», «B.Sc.», «PhD.», «IV», «мл.».

    Данные банковской карты и деньги

    Скопировать ссылку «Данные банковской карты и деньги» Скопировано

    • cc — given — name — имя (в странах, где дают два имени, это первое имя), как на банковской карте.
    • cc — additional — name — второе имя, как на банковской карте (для стран, где дают два имени).
    • cc — family — name — фамилия, как на банковской карте.
    • cc — name — полное имя в том виде, как оно указано на банковской карте.
    • cc — csc — код безопасности (три цифры на обороте карты).
    • cc — exp — месяц и год окончания срока действия карты.
    • cc — exp — month — месяц окончания срока действия карты.
    • cc — exp — year — год окончания срока действия карты.
    • cc — number — номер банковской карты или счёта.
    • cc — type — платёжная система.
    • transaction — amount — сумма перевода.
    • transaction — currency — валюта перевода.

    Личные данные

    Скопировать ссылку «Личные данные» Скопировано

    • bday — полная дата рождения.
    • bday — day — день рождения (число).
    • bday — month — месяц рождения.
    • bday — year — год рождения.
    • language — язык в формате языкового тега из списка BCP 47.
    • sex — пол или гендер.
    • organization — название организации.
    • organization — title — профессия или должность в организации.
    • photo — url-адрес изображения.

    Адрес

    Скопировать ссылку «Адрес» Скопировано

    • address — level1 — административная единица первого уровня. Обычно это название области, региона или штата.
    • address — level2 — административная единица второго уровня. В странах с двумя уровнями это чаще всего название населённого пункта.
    • address — level3 — административная единица третьего уровня.
    • address — level4 — административная единица четвёртого уровня, если адрес её содержит.
    • address — line1 , address — line2 , address — line3 — отдельные строки для адресов, которые используются, если нет поля со значением street — address .
    • country — код страны.
    • country — name — страна.
    • street — address — адрес, начиная с улицы. Не должен содержать название города, страны и индекс.
    • postal — code — почтовый индекс.

    Телефон

    Скопировать ссылку «Телефон» Скопировано

    • tel — полный номер телефона, включая код страны.
    • tel — area — code — телефонный код региона страны.
    • tel — country — code — телефонный код страны.
    • tel — extension — добавочный номер.
    • tel — local — номер телефона без кодов страны и региона.
    • tel — local — prefix — номер локальной АТС.
    • tel — local — suffix — номер абонента внутри сети АТС.
    • tel — national — номер телефона без кода страны.

    Ссылки

    Скопировать ссылку «Ссылки» Скопировано

    Подсказки

    Скопировать ссылку «Подсказки» Скопировано

    💡 Автозаполнение может быть отключено в настройках браузера.

    💡 Если автозаполнение не отключено в браузере и атрибут autocomplete не прописан в теге, то его значение по умолчанию принимается за on .

    💡 Если задать autocomplete = «on» для , то это сработает для всех вложенных элементов формы.

    На практике

    Скопировать ссылку «На практике» Скопировано

    Лена Райан советует

    Скопировать ссылку «Лена Райан советует» Скопировано

    🛠 Значение атрибута может перебиваться значениями, прописанными в дочерних элементах.

             form action="" autocomplete="off"> div> label for="name">Введите имяlabel> input id="name" type="text"> div> div> label for="email">Электронная почтаlabel> input id="email" type="email" autocomplete="on"> div> button type="submit">Отправитьbutton> form>

    Первый унаследует значение от родительского элемента и не будет заполняться автоматически. Для второго уже будет работать автозаполнение, поскольку для него прописан autocomplete = «on» .

    🛠 Для правильного автозаполнения желательно, чтобы:

    • у элементов , и были прописаны атрибуты name или id ;
    • они были обёрнуты в тег ;
    • сама форма имела кнопку отправки — или с атрибутом type = «submit» .

    🛠 Если пользователь должен ввести имя, рекомендуется использовать значение autocomplete = «name» вместо разделения на поля с отдельными частями имени, потому что имена могут иметь совершенно разную структуру.

    🛠 По той же причине рекомендуется использовать значение autocomplete = «cc — name» , если нужно вводить данные банковской карты.

    🛠 При создании нового аккаунта или изменении пароля следует использовать autocomplete = «new — password» для полей «Введите новый пароль» и «Подтвердите новый пароль», но не для поля «Введите текущий пароль». Это сделано, чтобы случайно не вписать существующий пароль, а также предложить помощь в создании безопасного пароля.

    Источник

    Читайте также:  Java необязательные параметры метода
Оцените статью
© 2024 Программирование