Срабатывание автозаполнения полей на других формах в Chrome и Safari

Привет всем! Может кто сталкивался, такая проблема, есть две формы на разных страницах, на сайте, авторизация и регистрация.

Форма авторизации:
form#login(action="/login", method="post")
    input#login_username(type="text", name="login_username", placeholder="Username")
    input#login_password(type="password", name="login_username", placeholder="Password")

Форма регистрации:
form#register(action="/sign-up", method="post")
    input#sign_up_email(type="email", name="sign_up_email", placeholder="E-mail")
    input#sign_up_username(type="text", name="sign_up_username", placeholder="Username")
    input#sign_up_password(type="password", name="sign_up_password", placeholder="Password")

Так вот, при авторизации браузер спрашивает, сохранить ли пароль? Если ему разрешить и после авторизации попробовать открыть форму регистрации, то она будет заполнена теми же данными, но мне это не нужно. Причем autocomplete="off" не помогает. Как он распознает поля? Имена и ID разные у всех полей. Не помогает изменение порядка полей и даже удаление поля "username" (в этом случае он заполняет "email" вместо "username".

Какой-то хаос. Неужели нет метода как-то этим управлять?
  • Вопрос задан
  • 7294 просмотра
Решения вопроса 1
m1shaW
@m1shaW
Нет. Пусть сохраняет. Бесполезно с этим возиться.
Ответ написан
Пригласить эксперта
Ответы на вопрос 6
smurov
@smurov
Не понятно кто я
Случайно напоролся на ваш вопрос, когда сам искал на него ответ.
Решение простое :)

<form autocomplete="off">
   <input name="name" type="text">
   <input name="password" type="password" autocomplete="new-password"> // autocomplete="new-password" это решение для хрома
</form>
Ответ написан
Faustlogger
@Faustlogger
Front-end developer
Нашел решение которое работает. Добавьте в форму скрытое поле password.
<input type="password" 
       autocomplete="off" 
       name="passwordFake" 
       style="position:absolute; opacity: 0; filter: alpha(opacity = 0);"/>


В чем суть проблемы - Safari для автокомплита детектит поля input[type=password] и от них играет. Чтобы его запутать, можно добавить скрытое поле и тогда будет заполняться оно. К сожалению, добавлять такой фикс прийдется во все формы, где хочешь избежать автокомплита.
Ответ написан
Комментировать
@dark-grey
как то тоже нужно было отрубить браузеру автозаполнение, при чем все танцы с autocomplete не давали никакого результата - браузер все равно усердно заполнял поля логином и паролем

помогло только прописать инпуту readonly свойство и удалять его при наведении мышью, в этом случае пользователь не заметит отличий

<input name="password" type="password" readonly onmouseover="this.removeAttribute('readonly')">


вариант с autocomplete="new-password" похоже тоже должен работать, правда возможно не во всех браузерах
https://developer.mozilla.org/en-US/docs/Web/Secur...
Ответ написан
Комментировать
maxaon
@maxaon
А где у вас autocomplete="off"? Должно быть и на форме, и на элементах.
Ответ написан
maxaon
@maxaon
Поменяйте идентификаторы и имена у полей/формы, поскольку сейчас у вас они аналогичные. Путь к формам тоже поменяйте. Меняйте на что-либо невразумительное.
А лучше не заморачивайте себе этим голову.
Ответ написан
Комментировать
@webpauchara
Проблема решена банальным добавлением скрытого текстового поля после нужного input. Если у нужного input есть класс, тот же класс добавить и скрытому.

<input type="text" style="display:none;">
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы