Ответ 1

Для новых версий Chrome вы можете просто положить autocomplete="new-password" в поле пароля и его. Я проверил его, отлично работает.

Получил этот отзыв от разработчика Chrome в этом обсуждении: https://bugs.chromium.org/p/chromium/issues/detail?id=370363#c7

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

Ответ 2

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

Старое решение

Просто используйте <form autocomplete="off"> и это предотвращает предварительную заполнение пароля, а также любое эвристическое заполнение полей на основе допущений, которые может сделать браузер (что часто бывает неправильно). В отличие от использования <input autocomplete="off"> который, похоже, в значительной степени игнорируется автозаполнением пароля (в Chrome, то есть Firefox выполняет его).

Обновленное решение

Chrome теперь игнорирует <form autocomplete="off">. Поэтому мое первоначальное обходное решение (которое я удалил) теперь стало яростью.

Просто создайте пару полей и сделайте их скрытыми с помощью "display: none". Пример:

<!-- fake fields are a workaround for chrome autofill getting the wrong fields -->
<input style="display:none" type="text" name="fakeusernameremembered"/>
<input style="display:none" type="password" name="fakepasswordremembered"/>

Затем поместите свои настоящие поля внизу.

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

Обновление марта 2016 года

Просто протестирован с последним Chrome - все хорошо. Это довольно старый ответ, но я хочу просто упомянуть, что наша команда уже много лет использует его на десятках проектов. Он по-прежнему отлично работает, несмотря на несколько комментариев ниже. Нет проблем с доступностью, потому что поля display:none них не означает, что они не получают фокуса. Как я уже говорил, вам нужно поставить их перед своими настоящими полями.

Если вы используете javascript для изменения вашей формы, вам потребуется дополнительный трюк. Покажите поддельные поля, пока вы манипулируете формой, а затем снова скройте их через миллисекунду позже.

Пример кода с использованием jQuery (если вы даете своим поддельным полям класс):

        $(".fake-autofill-fields").show();
        // some DOM manipulation/ajax here
        window.setTimeout(function () {
            $(".fake-autofill-fields").hide();
        },1);

Обновление июля 2018 года

Мое решение больше не работает так хорошо, так как специалисты по анти-юстиции Chrome очень усердно работали. Но они бросили нам кость в виде:

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

Это работает и в основном решает проблему.

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

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

Ответ 3

После нескольких месяцев борьбы я обнаружил, что решение намного проще, чем вы можете себе представить:

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

Это так просто, и это работает как шарм в Google Chrome!

Обновление за август 2019 года (ссылка на @JonEdiger в комментариях)

Примечание: в Интернете много информации о том, что браузеры теперь воспринимают autocomplete = 'false' так же, как autocomplete = 'off'. По крайней мере, на данный момент, это предотвращает автозаполнение для этих трех браузеров.

Установите его на уровне формы, а затем для входов, которые вы хотите отключить, установите недопустимое значение, например "none":

<form autocomplete="off"> 
  <input type="text" id="lastName" autocomplete="none"/> 
  <input type="text" id="firstName" autocomplete="none"/>
</form>

Ответ 4

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

Обходной путь - отключить автозаполнение браузера с использованием режима readonly и установить запись в фокусе:

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

Событие focus происходит при щелчках мышью и переходах по полям.

Обновление:

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, когда поля пароля имеют одинаковую форму. Я полагаю, браузер ищет поле пароля для вставки сохраненных учетных данных. Затем он автоматически заполняет имя пользователя в ближайшем поле textlike-input, которое появляется перед полем пароля в DOM (просто догадка из-за наблюдения). Поскольку браузер является последним экземпляром, и вы не можете его контролировать,

Это исправление только для чтения сработало для меня.

Ответ 5

Если вы реализуете функцию окна поиска, попробуйте установить для атрибута type значение search следующим образом:

<input type="search" autocomplete="off" />

Это работает для меня в Chrome v48 и выглядит как допустимая разметка:

https://www.w3.org/wiki/HTML/Elements/input/search

Ответ 6

Попробуйте это. Я знаю, что вопрос несколько стар, но это другой подход к проблеме.

Я также заметил, что проблема возникает чуть выше поля password.

Я пробовал оба метода вроде

<form autocomplete="off"> и <input autocomplete="off">, но никто из них не работал у меня.

Итак, я исправил его с помощью нижеприведенного фрагмента - просто добавил другое текстовое поле чуть выше поля типа пароля и сделал его display:none.

Что-то вроде этого:

<input type="text" name="prevent_autofill" id="prevent_autofill" value="" style="display:none;" />
<input type="password" name="password_fake" id="password_fake" value="" style="display:none;" />
<input type="password" name="password" id="password" value="" />

Надеюсь, что это поможет кому-то.

Ответ 7

Я не знаю почему, но это помогло и сработало для меня.

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

Я понятия не имею, почему, но autocompelete = "new-password" отключает автозаполнение. Он работал в последней версии 49.0.2623.112 chrome.

Ответ 8

Для меня простой

<form autocomplete="off" role="presentation">

Сделал это.

Протестировано на нескольких версиях, последняя попытка была на 56.0.2924.87

Ответ 9

Вы должны добавить этот атрибут:

autocomplete="new-password"

Ссылка на источник: Полная статья

Ответ 10

Это так просто и сложно:)

google chrome в основном ищет каждый первый видимый элемент пароля внутри тегов <form>, <body> и <iframe>, чтобы включить автозаполнение для них, поэтому, чтобы отключить его, вам нужно добавить фиктивный пароль:

• • если ваш элемент пароля внутри тега <form> вам нужно поместить фиктивный элемент в качестве первого элемента в вашей форме сразу после <form> открытого тега

  • если ваш элемент пароля не внутри тега <form> помещает фиктивный элемент в качестве первого элемента на вашей странице html сразу после <body> открытого тега

• Вам нужно скрыть фиктивный элемент без использования css display:none, поэтому в основном используйте следующий элемент как фиктивный пароль.

  <input type="password" style="width: 0;height: 0; visibility: hidden;position:absolute;left:0;top:0;"/>
  

Ответ 11

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

Вариант 1 - выберите весь текст при нажатии

Задайте значения входов для примера для вашего пользователя (например, [email protected]) или метку поля (например, Email) и добавьте к вашим словам класс с именем focus-select:

<input type="text" name="email" class="focus-select" value="[email protected]">
<input type="password" name="password" class="focus-select" value="password">

И вот jQuery:

$(document).on('click', '.focus-select', function(){
  $(this).select();
});

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

Вариант 2 - задайте значение электронной почты пробелу, затем удалите его

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

Если у пользователя нет JavaScript по какой-либо причине, убедитесь, что вы обрезаете их входную серверную сторону (вы, вероятно, должны быть в любом случае), если они не удаляют пробел.

Здесь jQuery:

$(document).ready(function() {
  setTimeout(function(){
    $('[autocomplete=off]').val('');
  }, 15);
});

Я установил тайм-аут на 15, потому что 5, казалось, работал иногда в моих тестах, поэтому утроение этого числа кажется безопасным.

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

Вариант 3 - скрытые входы

Поместите это в начало формы:

<!-- Avoid Chrome autofill -->
<input name="email" class="hide">

CSS

.hide{ display:none; }

Убедитесь, что вы храните заметку в формате HTML, чтобы другие разработчики не удаляли ее! Также убедитесь, что имя скрытого ввода релевантно.

Ответ 12

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

autocomplete="nope"

Ответ 13

Я добавляю этот бит для другой точки зрения. Почему бы не honeypot, чтобы остановить Chrome от ботов ваших полей? Кажется, для меня работает кросс-браузер. Стоит сделать снимок:

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

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

Ответ 14

Я обнаружил, что добавление этого в форму запрещает Chrome использовать Autofill.

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

Найдено здесь. https://code.google.com/p/chromium/issues/detail?id=468153#hc41

Неудивительно, что Chrome решил, что он знает лучше, чем разработчик о том, когда Autocomplete. Настоящая Microsoft чувствует к ней.

Ответ 15

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

добавление атрибута readonly к тегу вместе с удалением события onfocus устраняет проблему

Ответ 16

Для коммандов паролей имени пользователя это непростая задача. Эвристика Chrome ищет шаблон:

<input type="text">

а затем:

<input type="password">

Просто отмените этот процесс, сделав недействительным это:

<input type="text">
<input type="text" onfocus="this.type='password'">

Ответ 17

Майк Нельсонс предоставил решение для меня не в Chrome 50.0.2661.102 m. Просто добавив элемент ввода того же типа с дисплеем: ни один набор больше не отключает автозавершение собственного браузера. Теперь необходимо дублировать атрибут имени поля ввода, для которого вы хотите отключить автозаполнение.

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

<input name="dpart" disabled="disabled" type="password" style="display:none;">
<input name="dpart" type="password">
<input type="submit">

Ответ 18

Используйте css text-security: диск без использования type = password.

HTML

<input type='text' name='user' autocomplete='off' />
<input type='text' name='pass' autocomplete='off' class='secure' />

or

<form autocomplete='off'>
    <input type='text' name='user' />
    <input type='text' name='pass' class='secure' />
</form>

CSS

input.secure {
    text-security: disc;
    -webkit-text-security: disc;
}

Ответ 19

Если у вас возникли проблемы с хранением заполнителей, но отключив автозаполнение хрома, я нашел это решение.

Проблема

HTML

<div class="form">
    <input type="text" placeholder="name"><br>
    <input type="text" placeholder="email"><br>
    <input type="text" placeholder="street"><br>
</div>

http://jsfiddle.net/xmbvwfs6/1/

В приведенном выше примере все еще возникает проблема автозаполнения, но если вы используете required="required" и некоторый CSS, вы можете реплицировать заполнители, а Chrome не будет получать теги.

Решение

HTML

<div class="form">
    <input type="text" required="required">
    <label>Name</label>  
    <br>
    <input type="text" required="required">
    <label>Email</label>    
    <br>
    <input type="text" required="required">
    <label>Street</label>    
    <br>
</div>

CSS

input {
    margin-bottom: 10px;
    width: 200px;
    height: 20px;
    padding: 0 10px;
    font-size: 14px;
}
input + label {
    position: relative;
    left: -216px;
    color: #999;
    font-size: 14px;
}
input:invalid + label { 
    display: inline-block; 
}
input:valid + label { 
    display: none; 
}

http://jsfiddle.net/mwshpx1o/1/

Ответ 20

Ну, так как у всех нас есть эта проблема, я потратил некоторое время на создание рабочего расширения jQuery для этой проблемы. Google должен следовать разметке html, а не следовать Google

(function ($) {

"use strict";

$.fn.autoCompleteFix = function(opt) {
    var ro = 'readonly', settings = $.extend({
        attribute : 'autocomplete',
        trigger : {
            disable : ["off"],
            enable : ["on"]
        },
        focus : function() {
            $(this).removeAttr(ro);
        },
        force : false
    }, opt);

    $(this).each(function(i, el) {
        el = $(el);

        if(el.is('form')) {
            var force = (-1 !== $.inArray(el.attr(settings.attribute), settings.trigger.disable))
            el.find('input').autoCompleteFix({force:force});
        } else {
            var disabled = -1 !== $.inArray(el.attr(settings.attribute), settings.trigger.disable);
            var enabled = -1 !== $.inArray(el.attr(settings.attribute), settings.trigger.enable);
            if (settings.force && !enabled || disabled)
                el.attr(ro, ro).focus(settings.focus).val("");
        }
    });
};
})(jQuery);

Просто добавьте это в файл, например /js/jquery.extends.js, и включите его в jQuery. Примените его к элементам каждой формы при загрузке документа следующим образом:

$(function() {
    $('form').autoCompleteFix();
});

jsfiddle с тестами

Ответ 21

В 2016 году Google Chrome начал игнорировать autocomplete=off, хотя он есть в W3C. Ответ, который они опубликовали:

Сложность здесь в том, что где-то на протяжении всего пути web autocomplete = off становится значением по умолчанию для многих полей формы, без какой-либо реальной мысли о том, хорошо ли это для пользователей. Это не означает, что есть не очень правильные случаи, когда вы не хотите, чтобы данные автозаполнения браузера (например, в системах CRM), но в целом мы рассматриваем их как случаи меньшинства. В результате мы начали игнорировать autocomplete = off для данных автозаполнения Chrome.

Что, по сути, говорит: мы лучше знаем, чего хочет пользователь.

Они открыли еще одну ошибку, чтобы опубликовать допустимые случаи использования, когда требуется autocomplete = off

Я не встречал проблем, связанных с автозаполнением, во всех моих приложениях B2B, но только с вводом типа пароля.

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

<input type=name >

<form>
    <input type=password >
</form>

Ответ 22

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

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

Ответ 23

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

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

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

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

Ответ 24

Ранее введенные значения, кэшированные хром, отображаются как список выбора выпадающего списка. Это может быть отключено с помощью автозаполнения = выкл., явно сохраненный адрес в дополнительных настройках хром дает всплывающее окно автозаполнения, когда поле адреса получает фокус. Это может быть отключено с помощью автозаполнения = "false". Но это позволит хром отображать кешированные значения в раскрывающемся списке.

В поле ввода html следующее будет отключать оба.

Role="presentation" & autocomplete="off"

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

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

Chrome также учитывает атрибут "для" в элементе label. Его можно использовать для прерывания последовательности анализа хром.

Ответ 25

Установив autocomplete в off должны работать здесь. У меня есть пример, который используется Google на странице поиска. Я нашел это из элемента проверки.

Редактирование: В случае off не работает, то попробуйте false или nofill. В моем случае он работает с chrome версии 48.0

Ответ 26

Попробуйте выполнить следующий jQuery код, который работал у меня.

if ($.browser.webkit) {
    $('input[name="password"]').attr('autocomplete', 'off');
    $('input[name="email"]').attr('autocomplete', 'off');
}

Ответ 27

Здесь грязный хак -

У вас есть свой элемент здесь (добавление отключенного атрибута):

<input type="text" name="test" id="test" disabled="disabled" />

И затем внизу вашей веб-страницы добавьте JavaScript:

<script>
    setTimeout(function(){
        document.getElementById('test').removeAttribute("disabled");
        },100);
</script>

Ответ 28

Согласно отчету об ошибке Chromium # 352347 Chrome больше не относится к autocomplete="off|false|anythingelse" anyelse autocomplete="off|false|anythingelse", ни по формам, ни по входам.

Единственным решением, которое сработало для меня, было добавление поля фиктивного пароля:

<input type="password" class="hidden" />
<input type="password" />

Ответ 29

Различные решения, основанные на webkit. Как уже упоминалось, в любое время Chrome находит поле пароля, которое автоматически заполняет электронное письмо. AFAIK, это независимо от автозаполнения = [независимо].

Чтобы обойти это изменение, введите тип ввода в текст и примените шрифт безопасности webkit в любой форме.

.secure-font{
-webkit-text-security:disc;}

<input type ="text" class="secure-font">

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

Ответ 30

Единственный способ, который работает для меня, - это: (требуется jQuery)

$(document).ready(function(e) {
    if ($.browser.webkit) {
        $('#input_id').val(' ').val('');
    }
});