Как отключить autocomplete
в основных браузерах для определенного input
(или form field
)?
Firefox 30 игнорирует autocomplete="off"
для паролей, предпочитая вместо этого запрашивать пользователя, должен ли пароль храниться на клиенте. Обратите внимание на следующий комментарий от 5 мая 2014 года:
- Менеджер паролей всегда запрашивает, хочет ли он сохранить пароль. Пароли не сохраняются без разрешения пользователя.
- Мы являемся третьим браузером для реализации этого изменения после IE и Chrome.
Согласно документации разработчика Mozilla атрибут элемента формы autocomplete
предотвращает кэширование данных форм в старых браузерах.
<input type="text" name="foo" autocomplete="off" />
В дополнение к autocomplete=off
вы также можете иметь имена полей форм, которые будут рандомизированы кодом, который генерирует страницу, возможно, добавив некоторую строку, относящуюся к сеансу, в конец имен.
Когда форма отправлена, вы можете снять эту часть перед ее обработкой на стороне сервера. Это помешает веб-браузеру найти контекст для вашего поля, а также может помочь предотвратить атаки XSRF, потому что злоумышленник не сможет угадать имена полей для представления формы.
$_SESSION['codefield_name'] = md5(uniqid('auth', true));
Большинство основных браузеров и менеджеров паролей (правильно, IMHO) теперь игнорируют autocomplete=off
.
Зачем? Многие банки и другие сайты с высокой степенью безопасности добавили autocomplete=off
к своим страницам входа в систему "для целей безопасности", но это фактически снижает безопасность, поскольку это заставляет людей менять пароли на этих сайтах с высокой степенью безопасности, чтобы их было легко запомнить (и, следовательно, трещины), так как автозаполнение было нарушено.
Давным-давно большинство менеджеров паролей начали игнорировать autocomplete=off
, и теперь браузеры начинают делать то же самое только для ввода имени пользователя и пароля.
К сожалению, ошибки в реализациях автозаполнения вставляют имя пользователя и/или пароль в неправильные поля формы, вызывая ошибки проверки формы или, что еще хуже, случайно вставляя имена пользователей в поля, которые пользователь намеренно оставил пустым пользователем.
Что веб-разработчик делать?
Chrome 34, к сожалению, будет пытаться автоматически заполнять поля с помощью пользователя/пароля всякий раз, когда он видит поле пароля. Это довольно плохая ошибка, которая, надеюсь, изменит поведение Safari. Однако, добавление этого в начало вашей формы, кажется, отключает автозаполнение пароля:
<input type="text" style="display:none">
<input type="password" style="display:none">
Я еще не исследовал IE или Firefox полностью, но буду рад обновить ответ, если у других есть информация в комментариях.
Иногда даже autocomplete = off не помешает заполнять учетные данные в неправильные поля, но не в поле пользователя или ник.
Это обходное решение в дополнение к сообщению apinstein о поведении браузера.
исправить автозаполнение браузера в режиме "только для чтения" и установить запись в фокусе (щелчок и вкладка)
<input type="password" readonly
onfocus="this.removeAttribute('readonly');"/>
Обновление: Mobile Safari устанавливает курсор в поле, но не показывает виртуальную клавиатуру. Новое исправление работает, как раньше, но обрабатывает виртуальную клавиатуру:
<input id="email" readonly type="email" onfocus="if (this.hasAttribute('readonly')) {
this.removeAttribute('readonly');
// fix for mobile safari to show virtual keyboard
this.blur(); this.focus(); }" />
Демо-версия https://jsfiddle.net/danielsuess/n0scguv6/
//UpdateEnd
Потому что браузер автоматически заполняет учетные данные в неправильном текстовом поле !?
Я замечаю это странное поведение в Chrome и Safari, когда есть поля пароля в той же форме. Я думаю, браузер ищет поле пароля для вставки сохраненных учетных данных. Затем он автоматически заполняет (просто гадать из-за наблюдения) ближайшее текстовое поле ввода, которое появляется перед полем пароля в DOM. Поскольку браузер является последним экземпляром, и вы не можете его контролировать,
Это исправление только для чтения работало для меня.
<form name="form1" id="form1" method="post"
autocomplete="off" action="http://www.example.com/form.cgi">
Это будет работать в Internet Explorer и Mozilla FireFox, недостатком является то, что он не является стандартом XHTML.
Решение для Chrome заключается в добавлении autocomplete="new-password"
к паролю типа ввода.
Пример:
<form name="myForm"" method="post">
<input name="user" type="text" />
<input name="pass" type="password" autocomplete="new-password" />
<input type="submit">
</form>
Chrome всегда автозаполняет данные, если находит поле типа пароля, достаточно, чтобы указать для этого поля autocomplete = "new-password"
.
Это хорошо работает для меня.
Примечание. Убедитесь, что с изменениями F12 ваши изменения вступили в силу, во многих случаях браузеры сохраняют страницу в кеше, это показало мне плохое впечатление, что она не работает, но браузер фактически не внес изменений.
Как уже говорили другие, ответ autocomplete="off"
Тем не менее, я думаю, что стоит заявить, почему в некоторых случаях целесообразно использовать это, поскольку некоторые ответы на эти и повторяющиеся вопросы подсказывают, что лучше не выключать его.
Остановка браузеров, хранящих номера кредитных карт, не должна предоставляться пользователям. Слишком много пользователей даже не осознают, что это проблема.
Особенно важно отключить его в полях для кодов безопасности кредитных карт. Как говорится на этой странице:
"Никогда не сохраняйте защитный код... его значение зависит от предположения, что единственный способ предоставить его - это прочитать его с физической кредитной карты, доказав, что лицо, его предоставляющее, действительно держит карту".
Проблема в том, что если это общедоступный компьютер (интернет-кафе, библиотека и т.д.), То другие пользователи смогут легко украсть данные вашей карты, и даже на вашем собственном компьютере вредоносный веб-сайт может украсть данные автозаполнения.
Мне пришлось бы просить отличаться от тех ответов, которые говорят, чтобы избежать отключения автоматического завершения.
Первое, что нужно понять, - это то, что автоматическое заполнение, не будучи явно отключенным в поля формы входа, является сбоем PCI-DSS. Кроме того, если локальная машина пользователя скомпрометирована, любые данные автозаполнения могут быть тривиально получены злоумышленником из-за того, что он хранится в ящике.
Конечно, есть аргумент в пользу удобства использования, однако есть очень тонкий баланс, когда дело доходит до того, какие поля формы должны иметь автозаполнение, и которые не должны.
Три варианта: Сначала:
<input type='text' autocomplete='off' />
Второе:
<form action='' autocomplete='off'>
Третий (код javascript):
$('input').attr('autocomplete', 'off');
Я пробовал бесконечные решения, и тогда я нашел это:
Вместо autocomplete="off"
просто используйте autocomplete="false"
Просто так, и он работает как шарм в Google Chrome.
На связанную или фактически, совершенно противоположную ноту -
"Если вы являетесь пользователем вышеупомянутой формы и хотите снова включить функцию автозаполнения, используйте" заведомо пароль "на этой странице букмарклетов. Он удаляет все атрибуты
autocomplete="off"
из всех форм на странице. борьба с хорошей борьбой! "
Просто установите autocomplete="off"
. Для этого есть очень веская причина: вы хотите предоставить свои собственные функции автозаполнения!
Ни один из решений не работал у меня в этом разговоре.
Наконец-то я понял, что чистый HTML-решение, для которого требуется нет Javascript, работает в современных браузерах (кроме IE, нужно было хотя бы 1 catch, правда?), и не требует от вас отключения автозаполнения для всей формы.
Просто отключите автозаполнение на form
, а затем включите его для любого input
, который вы хотите, чтобы он работал в форме. Например:
<form autocomplete="off">
<!-- these inputs will not allow autocomplete and chrome
won't highlight them yellow! -->
<input name="username" />
<input name="password" type="password" />
<!-- this field will allow autocomplete to work even
though we've disabled it on the form -->
<input name="another_field" autocomplete="on" />
</form>
Я думаю, что autocomplete=off
поддерживается в HTML 5.
Спросите себя, почему вы хотите это сделать, хотя это может иметь смысл в некоторых ситуациях, но не делайте этого только ради этого.
Это менее удобно для пользователей и даже не проблема безопасности в OS X (упомянутый Сореном ниже). Если вы беспокоитесь о том, что люди, у которых их пароли украдены удаленно, - регистратор нажатий клавиш все еще может это сделать, даже если ваше приложение использует autcomplete=off
.
Как пользователь, который хочет, чтобы браузер помнил (большую часть) мою информацию, мне было бы неприятно, если бы ваш сайт не помнил мою.
Мы действительно использовали идею sasb для одного сайта. Это было веб-приложение для медицинского программного обеспечения для работы в офисе врача. Тем не менее, многие из наших клиентов были хирургами, которые использовали множество разных рабочих станций, в том числе полупубличных терминалов. Таким образом, они хотели удостовериться, что врач, который не понимает значения автоматически сохраненных паролей или не обращает внимания, не может случайно оставить свою регистрационную информацию легко доступной. Конечно, это было до идеи частного просмотра, который начинает отображаться в IE8, FF3.1 и т.д. Несмотря на это, многие врачи вынуждены использовать старые школьные браузеры в больницах с ИТ, которые не изменятся.
Итак, у нас была страница регистрации, генерирующая случайные имена полей, которые будут работать только для этого сообщения. Да, это менее удобно, но это просто поражает пользователя над головой, не сохраняя регистрационную информацию на публичных терминалах.
Был нестандартный способ сделать это (я думаю, Mozilla и Internet Explorer по-прежнему поддерживают его), но возиться с ожиданиями пользователей - плохая идея.
Если пользователь вводит данные своей кредитной карты в форме, а затем позволяет кому-то другому использовать этот браузер, это не ваша проблема. :)
Это работает для меня.
<input name="pass" type="password" autocomplete="new-password" />
Мы также можем использовать эту стратегию в других элементах управления, таких как текст, выбор и т.д.
Лучшее решение:
Запретить автозаполнение имени пользователя (или электронной почты) и пароля:
<input type="email" name="email"><!-- Can be type="text" -->
<input type="password" name="password" autocomplete="new-password">
Запретить автозаполнение поля:
<input type="text" name="field" autocomplete="nope">
Объяснение: autocomplete
продолжает работу в <input>
, autocomplete="off"
не работает, но вы можете изменить off
к случайной последовательности, как nope
.
Работает в:
Хром: 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63 и 64
Firefox: 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57 и 58
autocomplete
и он по-прежнему отображает предыдущие записи в качестве предложений автозаполнения под вводом.
Немного поздно в игре... но я просто столкнулся с этой проблемой и попробовал несколько сбоев, но этот работает для меня на MDN
В некоторых случаях браузер будет продолжать предлагать значения автозаполнения даже если атрибут автозаполнения отключен. Это неожиданное поведение может быть довольно загадочным для разработчиков. Трюк на самом деле принудительное завершение - это назначить случайную строку атрибуту так:
autocomplete="nope"
Добавление
autocomplete="off"
в тег формы отключит автозаполнение браузера (что ранее было введено в это поле) из всех полей input
в этой конкретной форме.
Протестировано:
Я решил бесконечную борьбу с Google Chrome с использованием случайных символов.
<input name="name" type="text" autocomplete="rutjfkde">
Надеюсь, что это поможет другим людям.
autocompleteoff
в желаемое поле ввода.
Попробуй добавить
readonly onfocus = "this.removeAttribute('readonly');"
в дополнение к
автозаполнения = "выключено"
на ввод (ы), которые вы не хотите запоминать данные формы (username
, password
и т.д.), как показано ниже:
<input type="text" name="UserName" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" >
<input type="password" name="Password" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" >
Обновление: ниже приведен полный пример, основанный на этом подходе, который предотвращает перетаскивание, копирование, вставку и т.д.
<input type="text" name="UserName" style="text-transform:lowercase;" placeholder="Username"
autocomplete="off" readonly onfocus="this.removeAttribute('readonly');"
oncopy="return false" ondrag="return false" ondrop="return false"
onpaste="return false" oncontextmenu="return false" >
<input type="password" name="Password" placeholder="Password" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" oncopy="return false" ondrag="return false"
ondrop="return false" onpaste="return false" oncontextmenu="return false" >
Протестировано на последних версиях основных браузеров, таких как Google Chrome
, Mozilla Firefox
, Microsoft Edge
и т.д., И работает без проблем. Надеюсь это поможет...
$(document).on('focus', 'input:password[readonly="readonly"]', function () { $(this).prop('readonly', false).blur().focus(); });
Добавление autocomplete="off"
не режет его.
Измените атрибут типа ввода на type="search"
.
Google не применяет автоматическое заполнение к входам с типом поиска.
Во избежание недопустимого XHTML вы можете установить этот атрибут с помощью javascript. Пример использования jQuery:
<input type="text" class="noAutoComplete" ... />
$(function() {
$('.noAutoComplete').attr('autocomplete', 'off');
});
Проблема заключается в том, что пользователи без javascript будут получать функциональные возможности автозаполнения.
Используйте нестандартное имя и идентификатор для полей, поэтому вместо имени введите "name_". Браузеры тогда не будут рассматривать это как поле имени. Лучшая часть этого - это то, что вы можете сделать это для некоторых, но не для всех полей, и будет автозаполнять некоторые, но не все поля.
Я не могу поверить, что это все еще проблема до тех пор, пока не сообщается. Вышеупомянутые решения не сработали для меня, поскольку сафари, казалось, знали, когда элемент не был отображен или вне экрана, однако для меня это работало:
<div style="height:0px; overflow:hidden; ">
Username <input type="text" name="fake_safari_username" >
Password <input type="password" name="fake_safari_password">
</div>
Надеюсь, что это полезно для кого-то!
Это проблема безопасности, которую браузеры игнорируют сейчас. Браузеры идентифицируют и хранят контент с использованием имен ввода, даже если разработчики считают, что информация чувствительна и не должна храниться. Создание имени входа, отличного от 2 запросов, решит проблему (но будет сохранено в кеше браузера, а также увеличит кеш браузера). Попросить пользователя активировать или деактивировать параметры в настройках браузера не является хорошим решением. Проблема может быть исправлена в бэкэнд.
Вот мое исправление. Подход, который я реализовал в своих рамках. Все элементы автозаполнения генерируются со скрытым входом следующим образом:
<? $r = rmd5(rand().mocrotime(TRUE)); ?>
<form method="POST" action="./">
<input type="text" name="<? echo $r; ?>" />
<input type="hidden" name="__autocomplete_fix_<? echo $r; ?>" value="username" />
<input type="submit" name="submit" value="submit" />
</form>
Затем сервер обрабатывает пост-переменные следующим образом:
foreach ($_POST as $key => $val)
{
if(preg_match('#^__autocomplete_fix_#', $key) === 1){
$n = substr($key, 19);
if(isset($_POST[$n]))$_POST[$val] = $_POST[$n];
}
}
Значение можно получить, как обычно
var_dump($_POST['username']);
И браузер не сможет предложить информацию из предыдущего запроса или от предыдущих пользователей.
Все работает как шарм, даже если браузеры обновляются, хотят игнорировать автозаполнение или нет. Это был лучший способ исправить эту проблему для меня.
попробуйте их, если только autocomplete="off"
не работает:
autocorrect="off" autocapitalize="off" autocomplete="off"
Ни один из упомянутых здесь хакеров не работал в Chrome. Здесь обсуждается проблема: https://code.google.com/p/chromium/issues/detail?id=468153#c41
Добавление этого внутри <form>
работает (по крайней мере на данный момент):
<div style="display: none;">
<input type="text" id="PreventChromeAutocomplete" name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>
maxlength="0"
не позволяет firefox maxlength="0"
поле.
Итак, вот он:
function turnOnPasswordStyle() {
$('#inputpassword').attr('type', "password");
}
<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">
Вы можете использовать на входе.
Например:
<input type=text name="test" autocomplete="off" />
Нет поддельных входов, нет javascript!
Невозможно автоматически отключить автозаполнение в браузерах. Я пробовал все разные предложения, и ни один из них не работает во всех браузерах. Единственный способ - не использовать ввод пароля вообще. Вот что я придумал:
<style type="text/css">
@font-face {
font-family: 'PasswordDots';
src: url('text-security-disc.woff') format('woff');
font-weight: normal;
font-style: normal;
}
input.password {
font-family: 'PasswordDots' !important;
font-size: 8px !important;
}
</style>
<input class="password" type="text" spellcheck="false" />
Загрузить: text-security-disc.woff
Вот как выглядит мой окончательный результат:
Отрицательный побочный эффект заключается в том, что можно скопировать обычный текст с входа, хотя должно быть возможно предотвратить это с помощью некоторых JS.
Многие современные браузеры больше не поддерживают autocomplete = "off" для полей входа. autocomplete="new-password"
вместо wokring, больше информации MDN docs
Вы можете просто поместить autocomplete="off"
в поля HTML, как следующий код.
<input type="text" name="" value="" autocomplete="off" />
Вы можете отключить автозаполнение, если вы удалите тег form
, то же самое было сделано моим банком, и мне было интересно, как они это сделали. Он даже удаляет значение, которое уже было запомнено браузером после удаления тега.
Chrome планирует поддерживать это.
В настоящее время лучшим предложением является использование типа ввода, который редко автозаполняется.
<input type='search' name="whatever" />
для совместимости с firefox, используйте обычный autocomplete = 'off'
<input type='search' name="whatever" autocomplete='off' />
Чтобы решить эту проблему, я использовал некоторые трюки CSS, и для меня это работает.
input {
text-security:disc;
-webkit-text-security:disc;
-mox-text-security:disc;
}
Пожалуйста, прочитайте эту статью для более подробной информации.
Я использую этот TextMode="password" autocomplete="new-password"
и на странице загрузки в aspx txtPassword.Attributes.Add("value", '');
Моя проблема была в основном автозаполнением с Chrome, но я думаю, что это, вероятно, более проблематично, чем автозаполнение.
Трюк: использование таймера в форме reset и установка полей пароля для пустых. Продолжительность 100 мс минимальна для работы.
$(document).ready(function() {
setTimeout(function() {
var $form = $('#formId');
$form[0].reset();
$form.find('INPUT[type=password]').val('');
}, 100);
});
Ответ dsuess, отправленный с помощью readonly, был очень умным и работал. Но поскольку я использую boostrap, поле ввода только для чтения было - до тех пор, пока оно не сфокусировано - отмечено серым фоном. Пока документ загружается, вы можете обмануть браузер, просто заблокировав и разблокировав вход.
Итак, у меня возникла идея реализовать это в решении jQuery:
jQuery(document).ready(function () { $("input").attr('readonly', true); $("input").removeAttr('readonly'); });
Если ваша проблема связана с автоматическим заполнением поля пароля, вы можете найти это полезным...
У нас была эта проблема в нескольких областях нашего сайта, где бизнес хотел повторно запросить у пользователя свое имя пользователя и пароль и специально не хотел, чтобы автозаполнение пароля работало по договорным причинам. Мы обнаружили, что самый простой способ сделать это - ввести ложное поле пароля для поиска и заполнения браузера, пока реальное поле пароля остается нетронутым.
<!-- This is a fake password input to defeat the browser autofill behavior -->
<input type="password" id="txtPassword" style="display:none;" />
<!-- This is the real password input -->
<input type="password" id="txtThisIsTheRealPassword" />
Обратите внимание, что в Firefox и IE достаточно просто ввести любой ввод пароля типа перед фактическим, но Chrome просмотрел его и заставил меня фактически называть ввод фальшивого пароля (давая ему очевидный идентификатор пароля) заставить его "укусить". Я использовал класс для реализации стиля вместо использования встроенного стиля, поэтому попробуйте, если приведенное выше не работает по какой-либо причине.
Это то, что мы назвали автозаполнением текстового поля. Мы можем отключить автозаполнение текстового поля двумя способами -
По коду
Чтобы отключиться в браузере, перейдите к настройке
Перейдите к настройке предварительной настройки и снимите флажок и затем Восстановите.
Если вы хотите отключить ярлык кодирования, вы можете сделать следующее:
Используя AutoCompleteType="Disabled"
:
<asp:TextBox runat="server" ID="txt_userid" AutoCompleteType="Disabled"></asp:TextBox>
Установив форму autocomplete="off"
:
<asp:TextBox runat="server" ID="txt_userid" autocomplete="off"></asp:TextBox>
Установив форму autocomplete="off"
:
<form id="form1" runat="server" autocomplete="off">
//your content
</form>
Используя код на странице .cs
protected void Page_Load(object sender, EventArgs e)
{
if(!Page.IsPostBack)
{
txt_userid.Attributes.Add("autocomplete", "off");
}
}
Используя JQuery
head runat="server">
<title></title>
<script src="Scripts/jquery-1.6.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#txt_userid').attr('autocomplete', 'off');
});
</script>
<script language="javascript" type="text/javascript">
$(document).ready(function () {
try {
$("input[type='text']").each(function(){
$(this).attr("autocomplete","off");
});
}
catch (e)
{ }
});
</script>
Чтобы предотвратить автоматическое заполнение браузера с помощью учетных данных для входа в систему пользователя, поместите поле ввода текста и пароля в верхней части формы с непустыми значениями и введите "position: absolute; top: -999px; left: -999px" set чтобы скрыть поля.
<form>
<input type="text" name="username_X" value="-" tabindex="-1" aria-hidden="true" style="position: absolute; top: -999px; left:-999px" />
<input type="password" name="password_X" value="-" tabindex="-1" aria-hidden="true" style="position: absolute; top: -999px; left:-999px" />
<!-- Place the form elements below here. -->
</form>
Важно, чтобы текстовое поле предшествовало полю пароля. В противном случае автозаполнение не может быть предотвращено в некоторых случаях.
Важно, чтобы значение полей текста и пароля не было пустым, чтобы в некоторых случаях предотвратить перезапись значений по умолчанию.
Важно, чтобы эти два поля находились в поле "реальные" типы паролей в форме.
Для более новых браузеров, которые соответствуют html 5.3, значение атрибута автозаполнения "new-password" должно работать.
<form>
<input type="text" name="username" value="" />
<input type="password" name="password" value="" autocomplete="new-password" />
</form>
Комбинация двух методов может использоваться для поддержки как старых, так и более новых браузеров.
<form>
<div style="display:none">
<input type="text" readonly tabindex="-1" />
<input type="password" readonly tabindex="-1" />
</div>
<!-- Place the form elements below here. -->
<input type="text" name="username" value="" />
<input type="password" name="password" value="" autocomplete="new-password" />
</form>
Google Chrome игнорирует атрибут autocomplete="off"
для определенных входов, включая ввод пароля и общие входы, обнаруженные по имени.
Например, если у вас есть вход с address
имени, то Chrome предоставит предложения автозаполнения по адресам, address
на других сайтах, даже если вы не скажете:
<input type="string" name="address" autocomplete="off">
Если вы не хотите, чтобы Chrome делал это, вы можете переименовать или namespace имя поля формы:
<input type="string" name="mysite_addr" autocomplete="off">
Если вы не возражаете с автозаполнением значений, которые ранее были введены на ваш сайт, вы можете оставить автозаполнение включенным. Именование пространства имен должно быть достаточным для предотвращения появления значений, запоминаемых с других сайтов.
<input type="string" name="mysite_addr" autocomplete="on">
Я смог остановить Chrome 66 от автозаполнения, добавив два поддельных входа и придав им абсолютную позицию:
<form style="position: relative">
<div style="position: absolute; top: -999px; left: -999px;">
<input name="username" type="text" />
<input name="password" type="password" />
</div>
<input name="username" type="text" />
<input name="password" type="password" />
Сначала я попробовал добавить display:none;
к входам, но Chrome игнорировал их и автоматически просматривал видимые.
Попробуйте следующее:
<input type='text' autocomplete='off' />
Как представляется, достичь этого невозможно, не используя комбинированную клиентскую сторону и код на стороне сервера.
Чтобы убедиться, что пользователь должен заполнить форму каждый раз без автозаполнения, я использую следующие методы:
Создайте имена полей формы на сервере и используйте скрытые поля ввода для хранения этих имен, чтобы при отправке на сервер код на стороне сервера мог использовать сгенерированные имена для доступа к значениям полей. Это означает, что пользователь не имеет возможности автоматически заполнять поля.
Поместите три экземпляра каждого поля формы в форму и скройте первый и последний поля каждого набора с помощью css, а затем отключите их после загрузки страницы с помощью javascript. Это делается для предотвращения автоматического заполнения браузером полей.
Вот скрипка, демонстрирующая javascript, css и html, как описано в # 2 https://jsfiddle.net/xnbxbpv4/
javascript:
$(document).ready(function() {
$(".disable-input").attr("disabled", "disabled");
});
css:
.disable-input {
display: none;
}
html:
<form>
<input type="email" name="username" placeholder="username" class="disable-input">
<input type="email" name="username" placeholder="username">
<input type="email" name="username" placeholder="username" class="disable-input">
<br>
<input type="password" name="password" placeholder="password" class="disable-input">
<input type="password" name="password" placeholder="password">
<input type="password" name="password" placeholder="password" class="disable-input">
<br>
<input type="submit" value="submit">
</form>
Вот пример того, что код сервера, использующий asp.net с бритвой, будет облегчать # 1
модель:
public class FormModel
{
public string Username { get; set; }
public string Password { get; set; }
}
:
public class FormController : Controller
{
public ActionResult Form()
{
var m = new FormModel();
m.Username = "F" + Guid.NewGuid().ToString();
m.Password = "F" + Guid.NewGuid().ToString();
return View(m);
}
public ActionResult Form(FormModel m)
{
var u = Request.Form[m.Username];
var p = Request.Form[m.Password];
// todo: do something with the form values
...
return View(m);
}
}
Вид:
@model FormModel
@using (Html.BeginForm("Form", "Form"))
{
@Html.HiddenFor(m => m.UserName)
@Html.HiddenFor(m => m.Password)
<input type="email" name="@Model.Username" placeholder="username" class="disable-input">
<input type="email" name="@Model.Username" placeholder="username">
<input type="email" name="@Model.Username" placeholder="username" class="disable-input">
<br>
<input type="password" name="@Model.Password" placeholder="password" class="disable-input">
<input type="password" name="@Model.Password" placeholder="password">
<input type="password" name="@Model.Password" placeholder="password" class="disable-input">
<br>
<input type="submit" value="submit">
}
Safari не изменит свое мнение об автозаполнении, если динамически установить autocomplete="off"
из javascript. Однако он будет уважать, если вы сделаете это на основе каждого поля.
$(':input', $formElement).attr('autocomplete', 'off');
Я знаю, что это старый пост, но может быть важно знать, что Firefox (я думаю, только firefox) использует значение под названием ismxfilled
, которое в основном заставляет автозаполнять.
ismxfilled="0"
для OFF
или
ismxfilled="1"
для ON
Если вы хотите, чтобы общий плагин браузера "LastPass" также не заполнял поле автоматически, вы можете добавить атрибут data-lpignore"=true"
добавленный к другим предложениям в этой теме. Обратите внимание, что это относится не только к полям пароля.
<input type="text" autocomplete="false" data-lpignore="true" />
Я пытался сделать то же самое некоторое время назад, и был озадачен, потому что ни одно из найденных мной предложений не сработало для меня. Оказалось, это был LastPass.
Вы можете использовать autocomplete = off во входных элементах управления, чтобы избежать автоматического завершения
Например:
<input type=text name="test" autocomplete="off" />
если вышеуказанный код не работает, попробуйте добавить эти атрибуты также
autocapitalize="off" autocomplete="off"
или
Измените атрибут type="search"
ввода на type="search"
. Google не применяет автоматическое заполнение к входам с типом поиска.
autocomplete = 'off' не работал у меня, так или иначе, я установил атрибут value входного поля в пробе, т.е. <input type='text' name='username' value=" ">
, который задал входной символ по умолчанию пробелу, а так как имя пользователя было пустым, пароль также был очищен.
Я хотел бы пояснить, что этот ответ для полноты и знаний сообщества никоим образом не рекомендуется.
Что касается Internet Explorer 11, есть функция безопасности, которая может быть использована для блокировки автозаполнения. Он работает следующим образом:
Значение ввода любой формы, измененное в JavaScript ПОСЛЕ того, как пользователь уже ввел его, помечается как неприемлемый для автозаполнения.
Эта функция обычно используется для защиты пользователей от вредоносных веб-сайтов, которые хотят изменить свой пароль после его ввода или т.д.
Однако вы можете вставить один специальный символ в начале строки пароля для блокировки автозаполнения. Этот специальный символ может быть обнаружен и удален позже по трубопроводу.
Обходной путь заключается не в том, чтобы вставить поле пароля в DOM, прежде чем пользователь захочет изменить пароль. Это может быть применимо в некоторых случаях:
В нашей системе у нас есть поле пароля, которое на странице администратора, поэтому мы должны избегать непреднамеренного установки паролей других пользователей. У этой формы есть дополнительный флажок, который по этой причине будет переключать видимость поля пароля.
Итак, в этом случае автозаполнение из диспетчера паролей становится двойной проблемой, поскольку вход не будет даже видимым для пользователя.
Решение заключалось в том, чтобы установить флажок, вводится ли поле пароля в DOM, а не только его видимость.
Псевдо-реализация для AngularJS:
<input type="checkbox" ng-model="createPassword">
<input ng-if="changePassword" type="password">
Я использую следующий фрагмент jQuery:
// Prevent input autocomplete
$.fn.preventAutocomplete = function() {
this.each(function () {
var $el = $(this);
$el
.clone(false, false)
.insertBefore($el)
.prop('id', '')
.hide()
;
});
};
И чем просто $('#login-form input').preventAutocomplete();
Попробуйте добавить фиктивный <input type="text" style="display: none"/>
перед вторым вводом.
Это сработало для меня как шарм.
<form autocomplete="off"> <input type="text" autocomplete="off" style="display:none"> </form>
мы можем использовать jquery для этого для всех браузеров, и есть плагин для этого https://github.com/terrylinooo/jquery.disableAutoFill. Это упрощает работу и в то же время для всех браузеров
наконец, я получил решение сначала добавить 2 скрытых текстовых поля
и просто добавьте угловую директиву, подобную этой
(function () {
'use strict';
appname.directive('changePasswordType', directive);
directive.$inject = ['$timeout', '$rootScope', '$cookies'];
function directive($timeout, $rootScope, $cookies) {
var directive = {
link: link,
restrict: 'A'
};
return directive;
function link(scope,element) {
var process = function () {
var elem =element[0];
elem.value.length > 0 ? element[0].setAttribute("type", "password") :
element[0].setAttribute("type", "text");
}
element.bind('input', function () {
process();
});
element.bind('keyup', function () {
process();
});
}
}
})()
затем используйте его в текстовом поле, где вам необходимо предотвратить автоматическое завершение
<input type="text" style="display:none">\\can avoid this 2 lines
<input type="password" style="display:none">
<input type="text" autocomplete="new-password" change-password-type>
NB: не забудьте включить jquery и type ="text"
изначально
Вы также можете использовать вместо ввода, чтобы пропустить часть автозаполнения.
Исправлена. Просто нужно добавить выше реального поля ввода
https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion - MDN https://medium.com/paul-jaworski/turning-off-autocomplete-in-chrome-ee3ff8ef0908 - средний протестированы на EDGE, Chrome (последняя версия v63), Firefox Quantum (57.0.4 64- бит), Firefox (52.2.0) поддельные поля являются обходным путем для автоматической обработки хрома/оперы, получая неправильные поля
const fakeInputStyle = {opacity: 0, float: 'left', border: 'none', height: '0', width: '0'}
<input type="password" name='fake-password' autoComplete='new-password' tabIndex='-1' style={fakeInputSyle} />
<TextField
name='userName'
autoComplete='nope'
...
/>
<TextField
name='password'
autoComplete='new-password'
...
/>
Ни один из предоставленных ответов не работал во всех проверенных вами браузерах. Основываясь на уже предоставленных ответах, это то, к чему я пришел (протестирован) на Chrome 61, Microsoft Edge 40 (EdgeHTML 15), IE 11, Firefox 57, Opera 49 и Safari 5.1. Это бесстыдно в результате многих испытаний; однако это работает для меня.
<form autocomplete="off">
...
<input type="password" readonly autocomplete="off" id="Password" name="Password" onblur="this.setAttribute('readonly');" onfocus="this.removeAttribute('readonly');" onfocusin="this.removeAttribute('readonly');" onfocusout="this.setAttribute('readonly');" />
...
</form>
<script type="text/javascript">
$(function () {
$('input#Password').val('');
$('input#Password').on('focus', function () {
if (!$(this).val() || $(this).val().length < 2) {
$(this).attr('type', 'text');
}
else {
$(this).attr('type', 'password');
}
});
$('input#Password').on('keyup', function () {
if (!$(this).val() || $(this).val().length < 2) {
$(this).attr('type', 'text');
}
else {
$(this).attr('type', 'password');
}
});
$('input#Password').on('keydown', function () {
if (!$(this).val() || $(this).val().length < 2) {
$(this).attr('type', 'text');
}
else {
$(this).attr('type', 'password');
}
});
</script>
Почему вы делаете свою жизнь менее удобной?
"Пароли/данные кредитной карты и т.д. не должны быть сохранены" - это плохой аргумент: при автозаполнении браузеры в Mac OS X хранят такие значения в зашифрованной базе данных с разрешениями для каждого приложения. И наоборот, каков реалистичный эффект autocomplete=off
? Пользователь собирается записать его в незашифрованном текстовом файле или, еще лучше, на заметку, прикрепленную к экрану.
Хорошо, что там есть такие закладки, как упомянутый Антти, и патчи, чтобы заставить движок игнорировать атрибут вообще.
Серьезно, я настоятельно призываю вас пересмотреть использование этого атрибута. Это никому не выгодно.