Я создал веб-приложение, которое использует раскрывающийся список тегов. Это прекрасно работает во всех браузерах, кроме браузера Chrome (версия 21.0.1180.89).

Несмотря на то, что оба inputполя И formполе, имеющее autocomplete="off"атрибут, Chrome настаивает на том, чтобы в раскрывающемся списке предыдущих записей для этого поля был удален список тегов.

ОБНОВИТЬ

Похоже, теперь Chrome игнорирует атрибуты style="display: none;"or style="visibility: hidden;.

Вы можете изменить это на что-то вроде:

<input style="opacity: 0;position: absolute;">
<input type="password" style="opacity: 0;position: absolute;">

По моему опыту, Chrome только автозаполнение первого <input type="password">и предыдущего <input>. Итак, я добавил:

<input style="display:none">
<input type="password" style="display:none">

К началу <form>и дело было решено.

Запретить автозаполнение имени пользователя (или адреса электронной почты) и пароля:

<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.

Другие «решения» для отключения автозаполнения поля (это не правильный способ, но это работает):

1.

HTML:

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

JS (нагрузка):

(function() {
    var some_id = document.getElementById('some_id');
    some_id.type = 'text';
    some_id.removeAttribute('autocomplete');
})();

или используя jQuery:

$(document).ready(function() {
    var some_id = $('#some_id');
    some_id.prop('type', 'text');
    some_id.removeAttr('autocomplete');
});

2.

HTML:

<form id="form"></form>

JS (нагрузка):

(function() {
    var input = document.createElement('INPUT');
    input.type = 'text';
    document.getElementById('form').appendChild(input);
})();

или используя jQuery:

$(document).ready(function() {
    $('<input>', {
        type: 'text'
    }).appendTo($('#form'));
});

Чтобы добавить более одного поля с помощью jQuery:

function addField(label) {
  var div = $('<div>');
  var input = $('<input>', {
    type: 'text'
  });
  
  if(label) {
    var label = $('<label>', {
      text: label
    });
    
    label.append(input);
    div.append(label);    
  } else {
    div.append(input);    
  }  
  
  div.appendTo($('#form'));
}

$(document).ready(function() {
  addField();
  addField('Field 1: ');  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form"></form>

Работает в:

• Хром: 49+

• Firefox: 44+

Похоже, что Chrome теперь игнорирует, autocomplete="off"если он не находится на <form autocomplete="off">теге.

Современный подход

Просто внесите свой вклад readonlyи, в фокусе, удалите его. Это очень простой подход, и браузеры не будут заполнять readonlyвводимые данные. Поэтому этот метод принят и никогда не будет перезаписан будущими обновлениями браузера.

<input type="text" onfocus="this.removeAttribute('readonly');" readonly />

Следующая часть не обязательна. Стиль вашего ввода соответственно, чтобы он не выглядел как readonlyвход.

input[readonly] {
     cursor: text;
     background-color: #fff;
}

РАБОЧИЙ ПРИМЕР

Для надежного обходного пути вы можете добавить этот код на страницу макета:

<div style="display: none;">
 <input type="text" id="PreventChromeAutocomplete" 
  name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>

Chrome учитывает autocomplete = off только тогда, когда в форме есть хотя бы один элемент ввода с любым другим значением автозаполнения.

Это не будет работать с полями пароля - они обрабатываются в Chrome совсем по-другому. См. Https://code.google.com/p/chromium/issues/detail?id=468153 для получения дополнительной информации.

ОБНОВЛЕНИЕ: Ошибка закрыта как «Не будет исправлена» командой Chromium 11 марта 2016 года. См. Последний комментарий в моем первоначально поданном отчете об ошибке , для полного объяснения. TL; DR: использовать семантические атрибуты автозаполнения, такие как autocomplete = "new-street-address", чтобы Chrome не выполнял автозаполнение.

Что ж, немного опоздал на вечеринку, но кажется, что есть некоторое недопонимание о том, как autocompleteдолжно и не должно работать. Согласно спецификациям HTML, пользовательский агент (в данном случае Chrome) может переопределить autocomplete:

https://www.w3.org/TR/html5/forms.html#autofilling-form-controls:-the-autocomplete-attribute

Пользовательский агент может позволить пользователю переопределить имя поля автозаполнения элемента, например, изменить его с «выкл» на «вкл», чтобы значения могли быть запомнены и предварительно заполнены, несмотря на возражения автора страницы, или всегда «выключен», никогда не запоминая ценности. Однако пользовательские агенты не должны позволять пользователям тривиально переопределять имя поля автозаполнения с «выключено» на «включено» или другими значениями, поскольку для пользователя существует значительный риск для безопасности, если все значения всегда запоминаются независимо от предпочтений сайта.

Так что в случае с Chrome разработчики, по сути, сказали: «Мы оставим это на усмотрение пользователя, чтобы решить в своих предпочтениях, хотят ли они autocompleteработать или нет. Если вы этого не хотите, не включайте его в своем браузере» ,

Тем не менее, кажется, что это немного чрезмерно с их стороны, на мой взгляд, но так оно и есть. В спецификации также обсуждаются потенциальные последствия такого шага для безопасности:

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

Поэтому, испытав такое же разочарование, как и все остальные, я нашел решение, которое работает для меня. Это похоже в духе autocomplete="false"ответов.

Статья в Mozilla говорит именно об этой проблеме:

https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion

В некоторых случаях браузер будет продолжать предлагать значения автозаполнения, даже если атрибут автозаполнения отключен. Такое неожиданное поведение может быть довольно загадочным для разработчиков. Хитрость в том, чтобы действительно принудительно завершить запрос, состоит в том, чтобы назначить случайную строку атрибуту

Таким образом, следующий код должен работать:

autocomplete="nope"

И так должен каждый из следующих:

autocomplete="false"
autocomplete="foo"
autocomplete="bar"

Проблема, которую я вижу, заключается в том, что агент браузера может быть достаточно умен, чтобы изучить autocompleteатрибут и применить его в следующий раз, когда увидит форму. Если это произойдет, то единственный способ обойти проблему - это динамически изменитьautocomplete значения атрибута при создании страницы.

Стоит отметить, что многие браузеры игнорируют autocompleteнастройки для полей входа в систему (имя пользователя и пароль). Как говорится в статье Mozilla:

По этой причине многие современные браузеры не поддерживают autocomplete = "off" для полей входа в систему.

• Если сайт устанавливает для формы autocomplete = "off", а форма содержит поля ввода имени пользователя и пароля, браузер по-прежнему будет предлагать запомнить этот логин, а если пользователь соглашается, браузер автоматически заполняет эти поля в следующий раз, когда пользователь заходит на эту страницу.
• Если сайт устанавливает autocomplete = "off" для полей ввода имени пользователя и пароля, браузер все равно предложит запомнить этот логин, и, если пользователь согласится, браузер автоматически заполнит эти поля при следующем посещении этой страницы пользователем.

Это поведение в Firefox (начиная с версии 38), Google Chrome (начиная с 34) и Internet Explorer (начиная с версии 11).

Наконец, небольшая информация о том, принадлежит ли атрибут formэлементу или inputэлементу. Спецификация снова имеет ответ:

Если атрибут autocomplete опущен, вместо него используется значение по умолчанию, соответствующее состоянию атрибута autocomplete владельца формы элемента («on» или «off»). Если владельца формы нет, то используется значение «on».

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

Резюме

Чтобы отключить autocompleteвсю форму:

<form autocomplete="off" ...>

Или, если вам нужно сделать это динамически:

<form autocomplete="random-string" ...>

Отключить autocompleteдля отдельного элемента (независимо от того, присутствует или нет параметр формы)

<input autocomplete="off" ...>

Или, если вам нужно сделать это динамически:

<input autocomplete="random-string" ...>

И помните, что определенные пользовательские агенты могут отвергать даже ваши самые упорные попытки отключить autocomplete.

Решение в настоящее время заключается в использовании type="search". Google не применяет автозаполнение для ввода с типом поиска.

Смотрите: https://twitter.com/Paul_Kinlan/status/596613148985171968

Обновление 04/04/2016: похоже, это исправлено! Смотрите http://codereview.chromium.org/1473733008

Chrome версии 34 теперь игнорирует autocomplete=off, смотрите это .

Много дискуссий о том, хорошо это или плохо? Каковы ваши взгляды?

Браузер не заботится об autocomplete = off auto или даже вводит учетные данные в неправильное текстовое поле?

Я исправил это, установив поле пароля только для чтения и активировав его, когда пользователь нажимает на него или использует клавишу табуляции в этом поле.

Исправить автозаполнение браузера: только для чтения и установить запись на фокус (при щелчке мышью и переходе по полям)

 <input type="password" readonly  
     onfocus="$(this).removeAttr('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, когда поля пароля имеют одинаковую форму. Я полагаю, браузер ищет поле пароля для вставки сохраненных учетных данных. Тогда AutoFills имени пользователя в ближайший textlike-поле ввода, которое появляется перед полем пароля в DOM (только гадать , из - за наблюдение). Поскольку браузер является последним экземпляром, и вы не можете им управлять, иногда даже autocomplete = off не помешает ввести учетные данные в неправильные поля, но не в поле пользователя или псевдонима.

Ты можешь использовать autocomplete="new-password"

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

Работает в:

• Хром: 53, 54, 55
• Firefox: 48, 49, 50

TL; DR: Скажите Chrome, что это новый ввод пароля, и он не будет предоставлять старые в качестве предложений автозаполнения:

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

autocomplete="off" не работает из-за дизайнерского решения - многие исследования показывают, что пользователям гораздо дольше и сложнее взламывать пароли, если они могут хранить их в браузере или диспетчере паролей.

Спецификация для autocomplete изменилась , и теперь поддерживает различные значения для упрощения автоматического заполнения форм входа в систему:

<!-- Auto fills with the username for the site, even though it's email format -->
<input type="email" name="email" autocomplete="username">

<!-- current-password will populate for the matched username input  -->
<input type="password" autocomplete="current-password" />

Если вы не предоставите эти данные, Chrome все еще пытается угадать, и когда это происходит, он игнорирует autocomplete="off".

Решение состоит в том, что autocompleteзначения также существуют для форм сброса пароля:

<label>Enter your old password:
    <input type="password" autocomplete="current-password" name="pass-old" />
</label>
<label>Enter your new password:
    <input type="password" autocomplete="new-password" name="pass-new" />
</label>
<label>Please repeat it to be sure:
    <input type="password" autocomplete="new-password" name="pass-repeat" />
</label>

Вы можете использовать этот autocomplete="new-password"флаг, чтобы Chrome не угадывал пароль, даже если он был сохранен для этого сайта.

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

Я решил бесконечный бой с Google Chrome с использованием случайных символов. Когда вы всегда визуализируете автозаполнение со случайной строкой, оно никогда ничего не запомнит.

<input name="name" type="text" autocomplete="rutjfkde">

Надеюсь, что это поможет другим людям.

Autocomplete="Off" больше не работает

Попробуйте использовать только случайную строку вместо "Off", напримерAutocomplete="NoAutocomplete"

Я надеюсь, что это помогает.

Видно, что хром игнорирует autocomplete="off", я решаю это глупым способом, который использует «фальшивый ввод», чтобы обмануть хром, чтобы заполнить его вместо того, чтобы заполнять «реальный».

Пример:

<input type="text" name="username" style="display:none" value="fake input" /> 
<input type="text" name="username" value="real input"/>

Chrome заполнит «ложный ввод», а при отправке сервер примет значение «реального ввода».

Я публикую этот ответ, чтобы найти обновленное решение этой проблемы. Я в настоящее время использую Chrome 49, и ни один ответ не работает для этого. Я также ищу решение для работы с другими браузерами и предыдущими версиями.

Поместите этот код в начало вашей формы

<div style="display: none;">
    <input type="text" autocomplete="new-password">
    <input type="password" autocomplete="new-password">
</div>

Затем, для вашего поля реального пароля, используйте

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

Прокомментируйте этот ответ, если он больше не работает или если у вас возникла проблема с другим браузером или версией.

Утверждено:

• Хром: 49
• Firefox: 44, 45
• Край: 25
• Internet Explorer: 11

всем, кто ищет решение этой проблемы, я наконец-то это выясню.

Chrome выполняет только autocomplete = "off", если страница является страницей HTML5 (я использовал XHTML).

Я преобразовал свою страницу в HTML5, и проблема исчезла (facepalm).

Измените атрибут типа ввода на type="search".

Google не применяет автозаполнение для входов с типом поиска.

Вплоть до прошлой недели два приведенных ниже решения работали для Chrome, IE и Firefox. Но с выпуском версии Chrome 48 (и все еще в 49) они больше не работают:

1. Следующее в верхней части формы:

<input style="display:none" type="text" name="fakeUsername"/>
<input style="display:none" type="password" name="fakePassword"/>

2. Следующее в элементе ввода пароля:

   автозаполнения = «выключено»

Поэтому, чтобы быстро это исправить, сначала я попытался использовать основной метод взлома первоначальной установки элемента ввода пароля как отключенного, а затем использовал setTimeout в функции готовности документа, чтобы включить его снова.

setTimeout(function(){$('#PasswordData').prop('disabled', false);}, 50);

Но это выглядело настолько сумасшедшим, и я провел еще несколько поисков и нашел ответ @tibalts в разделе « Отключение автозаполнения Chrome» . Его ответ заключается в использовании autocomplete = "new-password" при вводе паролей, и это, похоже, работает во всех браузерах (на этом этапе я сохранил исправление 1 выше).

Вот ссылка в обсуждении для разработчиков Google Chrome: https://code.google.com/p/chromium/issues/detail?id=370363#c7

autocomplete=off в основном игнорируется в современных браузерах - в первую очередь из-за менеджеров паролей и т. д.

Вы можете попробовать добавить это, autocomplete="new-password"он не полностью поддерживается всеми браузерами, но работает на некоторых

autocomplete="off"обычно работает, но не всегда. Это зависит nameот поля ввода. Имена, такие как «адрес», «электронная почта», «имя» - будут заполняться автоматически (браузеры считают, что они помогают пользователям), а такие поля, как «код», «пин-код» - не будут заполняться автоматически (еслиautocomplete="off" установлено)

Мои проблемы были - автозаполнение было возиться с Google помощником адреса

Я исправил это, переименовав это

от

<input type="text" name="address" autocomplete="off">

в

<input type="text" name="the_address" autocomplete="off">

Проверено в хроме 71.

Вместо autocomplete = "off" используйте autocomplete = "false" ;)

от: https://stackoverflow.com/a/29582380/75799

Понятия не имею, почему это работает в моем случае, но на Chrome я использовал, autocomplete="none"и Chrome перестал предлагать адреса для моего текстового поля.

Начиная с Chrome 42, ни одно из решений / хаков в этом потоке (на момент 2015-05-21T12:50:23+00:00) не работает для отключения автозаполнения для отдельного поля или всей формы.

РЕДАКТИРОВАТЬ: я обнаружил, что на самом деле вам нужно только вставить одно пустое поле электронной почты в форму (вы можете скрыть его display: none) перед другими полями, чтобы предотвратить автозаполнение. Я предполагаю, что chrome хранит какую-то сигнатуру формы с каждым полем автозаполнения, а включение другого поля электронной почты портит эту подпись и предотвращает автозаполнение.

<form action="/login" method="post">
    <input type="email" name="fake_email" style="display:none" aria-hidden="true">
    <input type="email" name="email">
    <input type="password" name="password">
    <input type="submit">
</form>

Хорошая новость заключается в том, что поскольку «подпись формы» искажается этим, ни одно из полей не заполняется автоматически, поэтому не требуется JS, чтобы очистить поддельные поля перед отправкой.

Старый ответ:

Единственное, что я нахожу все еще жизнеспособным, это вставить два фиктивных поля типа email и пароль перед реальными полями. Вы можете установить их, чтобы display: noneскрыть их (это недостаточно умно, чтобы игнорировать эти поля):

<form action="/login" method="post">
    <input type="email" name="fake_email" style="display:none" aria-hidden="true">
    <input type="password" name="fake_password" style="display:none" aria-hidden="true">
    <input type="email" name="email">
    <input type="password" name="password">
    <input type="submit">
</form>

К сожалению, поля должны быть в вашей форме (в противном случае оба набора вводятся автоматически). Итак, для того, чтобы поддельные поля были действительно проигнорированы, вам понадобится JS для запуска при отправке формы, чтобы очистить их:

form.addEventListener('submit', function() {
    form.elements['fake_email'].value = '';
    form.elements['fake_password'].value = '';
});

Обратите внимание, что очистка значения с помощью Javascript позволяет переопределить автозаполнение. Поэтому, если допустимо потерять правильное поведение с отключенным JS, вы можете упростить все это с помощью автозаполнения JS «polyfill» для Chrome:

(function(document) {

    function polyfillAutocomplete(nodes) {

        for(var i = 0, length = nodes.length; i < length; i++) {

            if(nodes[i].getAttribute('autocomplete') === 'off') {

                nodes[i].value = '';
            }
        }
    }

    setTimeout(function() {

        polyfillAutocomplete(document.getElementsByTagName('input'));
        polyfillAutocomplete(document.getElementsByTagName('textarea'));

    }, 1);

})(window.document);

У меня была похожая проблема, когда в поле ввода указывалось имя или адрес электронной почты. Я установил autocomplete = "off", но Chrome все еще выдвигал предложения. Оказывается, это произошло потому, что в тексте-заполнителе были слова «имя» и «электронная почта».

Например

<input type="text" placeholder="name or email" autocomplete="off" />

Я обошел это, поместив пробел нулевой ширины в слова в заполнителе. Нет больше автозаполнения Chrome.

<input type="text" placeholder="nam&#8203;e or emai&#8203;l" autocomplete="off" />

В Chrome 48+ используйте это решение:

1. Поместите поддельные поля перед реальными полями:

   <form autocomplete="off">
     <input name="fake_email"    class="visually-hidden" type="text">
     <input name="fake_password" class="visually-hidden" type="password">
   
     <input autocomplete="off" name="email"    type="text">
     <input autocomplete="off" name="password" type="password">
   </form>

2. Скрыть поддельные поля:

   .visually-hidden {
     margin: -1px;
     padding: 0;
     width: 1px;
     height: 1px;
     overflow: hidden;
     clip: rect(0 0 0 0);
     clip: rect(0, 0, 0, 0);
     position: absolute;
   }

3. Ты сделал это!

Также это будет работать для более старых версий.

После chrome v. 34 установка autocomplete="off"в <form>тег не работает

Я внес изменения, чтобы избежать этого раздражающего поведения:

1. Удалить nameи idиз ввода пароля
2. Поставьте класс на входе (напр .: passwordInput)

(Пока что Chrome не помещает сохраненный пароль на вход, но форма теперь повреждена)

Наконец, чтобы заставить форму работать, включите этот код для запуска, когда пользователь нажимает кнопку отправки или когда вы хотите инициировать отправку формы:

var sI = $(".passwordInput")[0];
$(sI).attr("id", "password");
$(sI).attr("name", "password");

В моем случае я использовал id="password" name="password"ввод пароля, поэтому я положил их обратно, прежде чем запускать передачу.

Перепробовав все решения, вот то, что, похоже, работает для версии Chrome: 45, с формой, имеющей поле пароля:

 jQuery('document').ready(function(){
        //For disabling Chrome Autocomplete
        jQuery( ":text" ).attr('autocomplete','pre'+Math.random(0,100000000));
 });

Я только что обновился до Chrome 49, и решение Diogo Cid больше не работает.

Я сделал другой обходной путь, скрывая и удаляя поля во время выполнения после загрузки страницы.

Теперь Chrome игнорирует исходный обходной путь, применяя учетные данные к первому отображаемому type="password" полю и его предыдущему type="text"полю, поэтому я скрыл оба поля с помощью CSS visibility: hidden;

<!-- HTML -->
<form>
    <!-- Fake fields -->
    <input class="chromeHack-autocomplete">
    <input type="password" class="chromeHack-autocomplete">

    <input type="text" placeholder="e-mail" autocomplete="off" />
    <input type="password" placeholder="Password" autocomplete="off" />
</form>

<!-- CSS -->
.chromeHack-autocomplete {
    height: 0px !important;
    width: 0px !important;
    opacity: 0 !important;
    padding: 0 !important; margin: 0 !important;
}

<!--JavaScript (jQuery) -->
jQuery(window).load(function() {
    $(".chromeHack-autocomplete").delay(100).hide(0, function() {
        $(this).remove();
    });
});

Я знаю, что это может показаться не очень элегантным, но это работает.

я нашел это решение наиболее подходящим:

function clearChromeAutocomplete()
{
// not possible, let's try: 
if (navigator.userAgent.toLowerCase().indexOf('chrome') >= 0) 
{
document.getElementById('adminForm').setAttribute('autocomplete', 'off'); 
setTimeout(function () {
        document.getElementById('adminForm').setAttribute('autocomplete', 'on'); 
}, 1500);
}
}

Он должен быть загружен после того, как DOM готов, или после того, как форма рендеринга.

Хотя я согласен с тем, что автозаполнение должно быть выбрано пользователем, бывают случаи, когда Chrome слишком увлечен этим (другие браузеры тоже могут). Например, поле пароля с другим именем по-прежнему автоматически заполняется сохраненным паролем, а предыдущее поле заполняется именем пользователя. Это особенно неприятно, когда форма является формой управления пользователями для веб-приложения, и вы не хотите, чтобы автозаполнение заполняло ее вашими учетными данными.

Chrome полностью игнорирует autocomplete = "off". Хотя взломы JS могут хорошо работать, я нашел простой способ, который работает во время написания:

Установите значение поля пароля для управляющего символа 8 ( "\x08"в PHP или в HTML). Это останавливает автоматическое заполнение поля Chrome, поскольку оно имеет значение, но фактическое значение не вводится, потому что это символ возврата.

Да, это все еще взлом, но это работает для меня. YMMV.