Подтвердить что ты не робот

Как я могу избежать предварительного заполнения полей браузера в моей регистрационной форме?

autocomplete="off" не то, что мне нужно. В основном, в моей регистрационной форме есть поля "телефон" и "пароль", размещенные один над другим. (см. скриншот)

Поле "телефон" получает, досадно, предварительно заполненное именем пользователя, так как я предполагаю, что делает браузер - браузер находит поле типа пароля и предполагает ввод текстового поля перед его именем. Эффект таков:

registration form snapshot

Почему меня не интересует нестандартный атрибут автозаполнения для телефонного поля, заключается в том, что я хочу, чтобы пользователь мог заполнить эту форму как можно проще, и если они ранее ввели свой номер телефона на других сайтах ( в поля, называемые "телефоном" ), они могут извлечь выгоду из этого, пока они начнут вводить текст в поле. Вот почему я не хочу полностью отключать автозаполнение.

Я больше думал о том, чтобы каким-то образом реорганизовать поля, чтобы избежать такого поведения. Или каким-либо образом сообщить браузеру, что поле над полем пароля не имеет к нему никакого отношения, или что поле пароля не используется для целей аутентификации. Как бы то ни было. Или ввести какой-нибудь невидимый элемент между этими двумя полями?

Любые идеи?

Используемая разметка:

<input id="phone" name="phone" type="text" value="" maxlength="30">
<input id="newPassword" name="newPassword" type="password" value="" maxlength="20">

Я получаю такое поведение в Chrome, FF (не уверен в IE, получил архаичную версию этого на моей машине, даже не хочу начинать беспокоиться об IE еще.)

4b9b3361

Ответ 1

Большинство менеджеров паролей будут искать первое поле пароля и ближайшее текстовое поле перед ним.

Итак, все, что вам нужно сделать, это добавить невидимые поля текста и пароля (display:none) выше "новый пароль".

Firefox пытается интерпретировать 3 поля пароля как действие "сменить пароль", поэтому, если вы не хотите, чтобы вы были в безопасности добавив еще одно невидимое поле пароля.

Ответ 2

У меня была аналогичная проблема с полем заданного пароля. Попробуйте

<input type="password" autocomplete="new-password">

Из документа MDN input:

автозаполнение

Этот атрибут указывает, будет ли значение элемента управления автоматически завершено браузером.

Возможные значения:

.... new-password: новый пароль (например, при создании учетной записи или изменении пароля)

Для номера телефона, я установил это, и он остановил автозаполнение имени пользователя.

<input type="tel">

Ответ 3

Домашний номер не может быть 30 символов, вероятно, поэтому браузер предполагает, что он может быть именем пользователя или логином входа в систему из-за размера. Измените его на что-то реальное и посмотрите, что произойдет.

Кроме того, рассмотрите наличие поля 3 для номера телефона, кода зоны, префикса, суффикса. После заполнения определенного количества цифр вы можете автофокусироваться с использованием JavaScript в следующем сегменте сегмента телефона, чтобы он был проще для пользователя.

Вы также пытались изменить позиции полей? Что случилось?

Кроме того, чтобы убедиться, что вы можете отключить автообновление по определенному элементу во время регистрации, не опасаясь, что он будет отключен во время входа в систему (если не будет), если вы не отключите его для полей входа, и, конечно, вам не нужно.

Кроме того, удалите неиспользуемые сохраненные формы автоматически, просто может быть локальной проблемой с вашей версией, вы, возможно, однажды ввели плохое значение в одном из браузеров, а затем вы установили другой браузер (хром или FF), а затем вновь установленный браузер скопировал правила точно так же, как и исходный браузер... Итак, вы в конечном итоге считаете глобальную проблему своей формой просто из-за одной плохой записи и потому, что ваш второй установленный браузер скопирован и скопировал правило плохого входа из вашего первого браузера, сделав его похожим на реальную, универсальную проблему для вас, заставьте меня? Поэтому попробуйте режимы InPrivate в браузерах или попробуйте браузеры с другой установки или другого компьютера или из экземпляра virtualpc, который у вас может быть.

В противном случае экспортируйте все свои настройки из своих браузеров и удалите оба браузера, затем переустановите с нуля FF и хром, затем проверьте свою веб-страницу, а затем не стесняйтесь импортировать экспортированные настройки обратно.

Кроме того, проверьте IE, даже если это для понимания, которое это может вам дать, знаете, что я имею в виду?

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

UPDATE:

Учитывая выбранный вами метод, то, что вы должны сделать, - при создании поля телефона добавьте атрибут value = "" во входной тег вместо использования JavaScript. Это должно предотвратить предварительное заполнение, не используя javascript. Теперь, если вы хотите сделать еще один шаг, вы можете сделать это:

Во время события OnLoad при загрузке страницы проверьте поле телефона с помощью JavaScript, и если значение равно одному пробелу ( "), перезапишите его пустой строкой, используя JavaScript, как только будет запущен onLoad. Или, если браузер все еще заполняется (я сомневаюсь, что это произойдет, но если это так), вы можете отложить эту проверку на несколько сотен миллисекунд и запустить javascript через несколько сотен миллисекунд после загрузки страницы или связать ее со всеми или некоторыми поля ввода в событиях Focus, так что, как только какое-либо из полей набирает фокус, вы делаете" does.phone.value равно одному пробелу ( "" ), и если это так, перезапишите его и пустую строку, я еще больше некоторые браузер не собирается входить в это поле и не улавливать это поле. Хотя, как уже упоминалось, даже если вы делаете это onLoad, я сомневаюсь, что браузер захватит ваше поле, так как загрузка страниц /javascript происходит ПОСЛЕ внутренних браузеров onLoad (DocumentComplete), и в худшем случае вы можете выполнить несколько сотен миллисекундных лаг или метод onFocus, но я сомневаюсь, что они вам понадобятся.

Сообщите мне, как это происходит.

Ответ 4

Я попытался отключить поля ввода type = text & type = password после загрузки DOM, затем включил все отключенные поля после того, как определенные миллисекунды позволяют говорить 100. Кажется, это работает для меня. Попробуйте:

$(document).ready(function()
{
$("input[type=text],input[type=password]").prop('disabled','disabled');

$("body").delay(10,function(){
    $("input[type=text],input[type=password]").prop('disabled','');
    });
});