Угловой пароль ввода автозаполнения [дубликат]

В настоящее время нет способа выбрать родительский элемент элемента в CSS.

Если бы был способ сделать это, это было бы в любой из текущих спецификаций селекторов CSS:

Тем временем, вам придется прибегнуть к JavaScript, если вам нужно выбрать родительский элемент.


Рабочий блок для выбора уровня 4 включает псевдокласс класса :has(), который работает аналогично реализации jQuery . По состоянию на 2018 год это все равно не поддерживается никаким браузером .

Используя :has(), исходный вопрос можно было бы решить с помощью этого:

li:has(> a.active) { /* styles to apply to the li tag */ }

620
задан George Kagan 8 November 2016 в 14:00
поделиться

30 ответов

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

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

Я попробовал как методы, подобные

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

Поэтому я исправил его с помощью нижеприведенного фрагмента - просто добавил другое текстовое поле чуть выше типа пароля (f5).

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

<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="" />

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

57
ответ дан arun 17 August 2018 в 23:43
поделиться
  • 1
    Это работало для меня (пока). Я обнаружил, что с течением времени я использовал около полудюжины разных хаков, и через некоторое время Хром решил, что хочет победить этот хак. Так нужен новый, такой как этот. В моем приложении у меня есть форма обновления профиля с полями электронной почты и пароля, которые должны быть пустыми, если пользователь не хочет вносить изменения. Но когда Chrome autofills, он помещает идентификатор пользователя в «подтверждение по электронной почте». в результате возникают всевозможные условия ошибок, которые приводят к дополнительным условиям ошибки, так как пользователь задыхается, пытаясь сделать правильные вещи. – Jeffrey Simon 25 July 2014 в 20:48
  • 2
    Быстрое объяснение того, почему этот хак работает (на данный момент): Chrome видит первый тип = ввод пароля и автозавершает его, и он предполагает, что поле непосредственно перед этим ДОЛЖНО быть полем userhame и автоматически заполняет это поле с именем пользователя. @JeffreySimon это должно объяснить явление userid в поле подтверждения электронной почты (я видел то же самое в своей форме). – MrBoJangles 7 October 2014 в 00:22
  • 3
    @kentcdodds - не уверен, что вы имеете в виду, что больше не работает. У вашего jsbin нет поля пароля, так что это совсем другая ситуация. Я использую это решение в течение многих лет, и совсем недавно я заметил, что это было необходимо, и это работало для меня только на прошлой неделе (март 2015 года). – mike nelson 22 March 2015 в 08:14
  • 4
    Ура! Решение, которое работает! Я бы посоветовал присвоить поле имя password и actual_password для законного поля, поскольку Google теперь, похоже, смотрит на name. Однако это означает, что Chrome не сохранит пароль, , который я действительно хочу использовать . AAAAARRRRGHH! – rybo111 13 June 2015 в 21:55
  • 5
    Обновление: это продолжается с тех пор, как я его реализовал в течение года. У нас может быть солидный победитель здесь. – MrBoJangles 3 September 2015 в 23:23
<input readonly onfocus="this.removeAttribute('readonly');" type="text">

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

9
ответ дан Avindu Hewa 17 August 2018 в 23:43
поделиться
  • 1
    Подтверждено, что не работает над 65.0.3325.181 – Terry Lin 27 March 2018 в 02:03

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

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

5
ответ дан Chris Pratt 17 August 2018 в 23:43
поделиться

Иногда даже 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();  }" />

Live Demo https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

Объяснение: Авторизатор автоматически заполняет учетные данные в неправильном текстовом поле?

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

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

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

73
ответ дан Cœur 17 August 2018 в 23:43
поделиться
  • 1
    какое замечательное решение :) вы должны заменить jquery следующим: this.removeAttribute («класс») – Roey 9 February 2015 в 12:52
  • 2
    Спасибо, Рой. Я обновил фрагмент. – dsuess 9 February 2015 в 23:10
  • 3
    Это решение больше не работает: jsbin.com/sobise/edit – kentcdodds 20 March 2015 в 23:44
  • 4
    @Clint: мой фрагмент кода выше удаляет атрибут readonly , как только пользователь вводит это поле (за клик мыши или ключ табуляции). Я думаю, вы ссылаетесь на поле, которое auto fill protected , но не коснулось пользователя. Какова цель этого поля - и действительно ли это необходимо для защиты? В зависимости от сценария удаление всех атрибутов readonly при отправке может быть опцией. Можете ли вы добавить более конкретный комментарий к своей проблеме? Может быть, я могу помочь вам :) – dsuess 5 May 2015 в 20:05
  • 5
    Если вы используете JavaScript. почему бы просто не установить значение dummy, а затем снова удалить значение? Добавление и удаление readonly звучит как опасный ход - что, если браузер не хочет, чтобы вы сосредоточились на нем? – rybo111 13 June 2015 в 22:02

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

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

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

https://www.w3.org/TR/html-markup/input.search.html

4
ответ дан dana 17 August 2018 в 23:43
поделиться

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

autocomplete="nope"
5
ответ дан Denis Brezhitskiy 17 August 2018 в 23:43
поделиться
  • 1
    RE: «непредвиденное поведение» Это поведение побуждает Google, который считает, что лучше, чем разработчики, знает, как каждая страница должна работать. Иногда мне просто нужен ввод сырого пароля, нулевые оборки. – Regular Joe 10 March 2018 в 00:45
  • 2
    эта комбинация FINALLY работала для меня: role = & quot; представление & quot; автополный = & Quot; Нету & Quot; протестирован в Chrome версии 64.0.3282.186 (Official Build) (64-разрядная версия). Какой кошмар! – billy jean 21 March 2018 в 20:26
  • 3
    Случайная строка работает для chrome, но не firefox. Для полноты я использую оба слова «autocomplete =« off-no-complete »& quot; и установите атрибут readonly с помощью onfocus = & quot; this.readOnly = false & quot ;. Мое приложение является корпоративным приложением, которое пользователи используют для ввода тысяч адресов, поэтому прецедент для управления этим является реальным - я также могу гарантировать использование Javascript, поэтому, по крайней мере, у меня это получилось – ChronoFish 12 July 2018 в 13:51

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

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

<input type="password" class="hidden" />
<input type="password" />
4
ответ дан Dr. Gianluigi Zane Zanettini 17 August 2018 в 23:43
поделиться

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

<input type="text">

, за которым следуют:

<input type="password">

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

<input type="text">
<input type="text" onfocus="this.type='password'">
6
ответ дан falsarella 17 August 2018 в 23:43
поделиться
  • 1
    К сожалению, это относится не только к типам имени пользователя и пароля. Chrome рассмотрит текст заполнителя, чтобы указать, что предложить. Например: jsbin.com/jacizu/2/edit – kentcdodds 20 March 2015 в 23:47
  • 2
    Действительно, вы все равно сможете заполнить поля предложениями браузеров, как демонстрирует ваш пример, поэтому на самом деле это не затрагивает проблему OP. Это решение просто предотвращает «автоматический» браузер. заполнение имен пользователей и паролей, как в примере, с помощью верхнего ответа. Это может быть полезно для некоторых, но не является окончательным решением просто отключить автозаполнение, которое должно будет поступать от Google. – Bernesto 21 March 2015 в 03:43
  • 3
    Хотя, если вы добавите пробел перед текстом заполнителя, он также отключит автоматическое предложение на основе заполнителя. Определенно, взлом, хотя и не более, чем другие предложения. jsbin.com/pujasu/1/edit – Bernesto 21 March 2015 в 03:58
  • 4
    на самом деле ... похоже, это сработало для вашего примера, но почему-то это не работает для меня :-( – kentcdodds 21 March 2015 в 04:49
  • 5
    Ха! Вот почему это называется хак ... У вас есть пример, который вы можете поделиться, где он не работает? – Bernesto 21 March 2015 в 15:36

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

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

  1. , если ваш элемент пароля внутри тега <form> вам нужно сразу же принести фиктивный элемент в качестве первого элемента в вашей форме после <form> открыть тег, если ваш элемент пароля, не входящий в тег <form>, помещает фиктивный элемент в качестве первого элемента на вашей странице html сразу после <body> открытого тега
  2. Вам нужно скрыть фиктивный элемент без использования css display:none, поэтому в основном используйте следующий элемент как фиктивный пароль.
    <input type="password" style="width: 0;height: 0; visibility: hidden;position:absolute;left:0;top:0;"/>
    
17
ответ дан Fareed Alnamrouti 17 August 2018 в 23:43
поделиться
  • 1
    Отличная работа, как вы узнали алгоритм Chrome? Я только узнал, что мой старый метод, изменяющий значение с JS после того, как страница была загружена таймером setTimeout, больше не работает. Но это работает отлично! – user 18 March 2016 в 04:06
  • 2
    спасибо, что это были испытания :) – Fareed Alnamrouti 18 March 2016 в 05:22
  • 3
    на самом деле он работает, просто установил свойство name;) – Fareed Alnamrouti 1 April 2016 в 05:26
  • 4
    Фантастический, работает с Chrome v50.0.2661.75. – Tom Regan 15 April 2016 в 17:56
  • 5
    Подтверждено, что не работает над 65.0.3325.181 – Terry Lin 27 March 2018 в 02:03

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

autocomplete="new-password"

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

20
ответ дан Hitesh Kalwani 17 August 2018 в 23:43
поделиться

Я столкнулся с такой же проблемой. И вот решение для отключения автоматического заполнения имени пользователя & amp; пароль в Chrome (только что протестирован только с Chrome)

    <!-- Just add this hidden field before password as a charmed solution to prevent auto-fill of browser on remembered password -->
    <input type="tel" hidden />
    <input type="password" ng-minlength="8" ng-maxlength="30" ng-model="user.password" name="password" class="form-control" required placeholder="Input password">
3
ответ дан hitman 17 August 2018 в 23:43
поделиться
  • 1
    странное исправление, но как-то это единственное, что работает для меня на хроме 48 :) – Jacka 15 February 2016 в 12:40

Вот грязный хак -

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

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

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

<script>
    setTimeout(function(){
        document.getElementById('test').removeAttribute("disabled");
        },100);
</script>
4
ответ дан hyper_st8 17 August 2018 в 23:43
поделиться

попробуйте пробел в значении:

<input type="email" name="email" value="&nbsp;">
<input type="password" name="password" value="&nbsp;">

chrome 54.0.2840.59

3
ответ дан Isaac Limón 17 August 2018 в 23:43
поделиться
  • 1
    Это вставляет это несжатое пространство во вход. – ivan_pozdeev 4 August 2018 в 20:15

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

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

Сделал это.

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

28
ответ дан Kuf 17 August 2018 в 23:43
поделиться
  • 1
    Это не работает для меня (53.0.2785.116). – Mike Rockétt 8 October 2016 в 15:47
  • 2
    Не работает ... вы должны указать, какая версия работает ... – Arnold Roa 28 February 2017 в 12:24
  • 3
    Добавлена ​​версия @ArnoldRoa, она была на нашем сайте с того дня, когда я опубликовал ее, и у меня было несколько версий, где она работала нормально. какую версию вы используете? PC / Mac? – Kuf 28 February 2017 в 22:04
  • 4
    @Dummy Я тестировал его сейчас на chrome latest (57), и он все еще работает на меня. Вы сделали что-то особенное с полями ввода? cap вы помещаете свой код где-нибудь, я мог бы попытаться воспроизвести? – Kuf 22 March 2017 в 15:26
  • 5
    Версия 64.0.3282.186 (Official Build) (64-разрядная версия) Windows. 2018-03-01 НЕ РАБОТАЕТ для отключения автозаполнения. – billy jean 21 March 2018 в 20:12

Ну, так как у всех нас есть эта проблема, я потратил некоторое время на создание рабочего расширения 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 с тестами

4
ответ дан MagicSux 17 August 2018 в 23:43
поделиться

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

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

<input name="dpart" disabled="disabled" type="password" style="display:none;">
<input name="dpart" type="password">
<input type="submit">
6
ответ дан mccainz 17 August 2018 в 23:43
поделиться
  • 1
    Что касается июня 2016 года и Chrome 51.0.2704.106 м, это единственное рабочее решение здесь – Denis 29 June 2016 в 14:46
  • 2
    Но будет ли форма выбрать нужное (видимое) поле ввода, которое вам нужно? Потому что это одно и то же имя. – AlexioVay 3 July 2016 в 07:33
  • 3
    @Vaia, добавление атрибута disabled в дублирующий элемент предотвратит его отправку. – mccainz 13 September 2016 в 17:24

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

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

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

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

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

4
ответ дан Michael. 17 August 2018 в 23:43
поделиться
  • 1
    Спасибо! Это единственное, что работает в chrome 49. Предыдущие методы ломались, поскольку хром, похоже, теперь заполняет все входы с помощью type="password". – epelc 6 March 2016 в 05:17

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

Old Solution

Просто используйте <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 недавно начал заполнять поле «Электронная почта» снова, поэтому я удвоил и добавил больше фальшивых полей непосредственно перед полем «Электронная почта» и исправил его , Удаление первой или второй партии полей возвращается к некорректному избыточному автозаполнению.

488
ответ дан mike nelson 17 August 2018 в 23:43
поделиться
  • 1
    Я был так уверен, что это сработает, когда вы прекрасно объясняете эвристическое автозаполнение, которое я испытываю при вводе пароля перед полем. К сожалению, это не сработало для меня, я положил autocomplete = & quot; off & quot; как по форме, так и по всем входам, и они все еще заполняются. Единственное решение, которое сработало для меня, - это ссылка выше. (ввод второго скрытого типа = «пароль») до того, как пароль сбросит эвристические проверки хром) – parliament 5 May 2014 в 20:00
  • 2
    Это хорошо работает, я тоже использовал его, но с момента обновления Chrome некоторое время назад (между 5 и 5 мая) Chrome игнорирует свойство формы :( – Tominator 14 May 2014 в 08:47
  • 3
    Google принял решение в (Chrome v34, я думаю), чтобы сделать его политикой, чтобы ВСЕГДА теперь игнорировать autocomplete = & quot; off & quot ;, включая директивы уровня уровня ..., что было бы хорошо, если бы на самом деле получило эти проклятые поля. – Jammer 1 June 2014 в 20:52
  • 4
    try autocomplete = & quot; false & quot; не автозаполнение = & quot; off & quot; – roughcoder 21 April 2015 в 10:20
  • 5
    Этот атрибут также требуется: autocomplete="I told you I wanted this off, Google. But you would not listen." – rybo111 13 June 2015 в 21:45

Вместо ответов «это то, что сработало для меня» и других ответов, которые выглядят как полные хаки ... В настоящее время хром (и последняя спецификация) обрабатывает атрибуты autocomplete на ваших input элементах:

https://developers.google.com/web/fundamentals/design-and-ui/input/forms/label-and-name-inputs?hl=ru

TLDR: добавьте autocomplete='<value>' на ваши входы, где <value> должна быть любой строкой, определяющей, для чего это поле. Это работает аналогично атрибуту name. Используйте возможные значения по ссылке выше, где это возможно.

Также удалите атрибут автозаполнения из вашей формы

3
ответ дан Mr Lister 17 August 2018 в 23:43
поделиться

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

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

5
ответ дан mumair 17 August 2018 в 23:43
поделиться
  • 1
    & Quot; выключен & Quot; не работает, он должен быть «ложным». – itinance 20 February 2016 в 12:29
  • 2
    это связано с Google Chrome – mumair 22 February 2016 в 12:16
  • 3
    Ничего не работало, но «nofill» волшебным образом это делает для меня .. – caden311 14 June 2018 в 14:17

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

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

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

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

5
ответ дан MZaragoza 17 August 2018 в 23:43
поделиться

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

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

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

209
ответ дан Olivier Pons 17 August 2018 в 23:43
поделиться
  • 1
    Работал для меня! Но есть одно важное замечание: у меня есть 5 полей на моей веб-странице: имя, адрес, почтовый индекс, телефон и электронная почта. Когда я включил autocomplete = 'false' в поле Form и в поле Name, он все еще работал. Однако, когда я включил автозаполнение = «false» также в поле «Адрес», он в конечном итоге прекратил их автозаполнение! Таким образом, вы должны поместить свойство autocomplete не в поле имени пользователя или имени, но и в следующие поля! (Работала на Chrome 43.0.2357.81 на 2015-05-27) – Dvd Franco 27 May 2015 в 03:25
  • 2
    ЕСЛИ ЭТО НЕ РАБОТАЕТ ДЛЯ ВАС: Имейте в виду, что есть два способа Chrome & quot; помогает & quot; пользователи. AUTOCOMPLETE будет запрашивать на основе предыдущего представления в той же форме и будет влиять на людей, которые используют форму более одного раза. Автозаполнение отключено с автозаполнением = & quot; off & quot ;. AUTOFILL запросит на основе адресной книги ранее заполненные аналогичные формы на других страницах. Он также выделит поля, которые он меняет. Автозаполнение может быть отключено с помощью автозаполнения = «false». – genkilabs 28 May 2015 в 16:18
  • 3
    Это не работает для меня (версия 43.0.2357.124 м). Вероятно, это был надзор со стороны Google, который теперь разрешен. Кажется, они думают, что «пользователь всегда прав». в том, что они хотят автозаполнять все. Проблема в том, что моя регистрационная форма сохраняет пользовательские данные так же, как и форма входа в систему, что наиболее определенно not , что хочет пользователь ... – rybo111 13 June 2015 в 21:41
  • 4
    YEP Работает в Chrome 43.0.2357! это поведение в Chrome настолько раздражает, и это обходное решение заняло у меня некоторое время, чтобы понять. Спасибо за Ваш ответ. – Adriano Rosa 2 July 2015 в 21:54
  • 5
    Не работает на Chrome 46.0.2490.80 м – Toolkit 30 October 2015 в 12:13

Я обнаружил, что добавление этого в форму не позволяет 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 решил, что он знает лучше, чем разработчик о том, когда нужно автозаполнять. Имеет в себе настоящую Microsoft.

9
ответ дан Rob Jensen 17 August 2018 в 23:43
поделиться
  • 1
    На самом деле это не факт, что вы сказали PreventChromeAutocomplete. Я смог получить автозаполнение для работы, сказав autocomplete = & quot; off & quot; и name = "somename". Но это работает, только если вы называете два разных входа одинаковыми. Поэтому в вашем случае PreventChromeAutocomplete должен быть применен к двум различным входам. Очень странно... – Joe Heyming 15 December 2015 в 21:02

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

Проблема

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 /

6
ответ дан Ryan Grush 17 August 2018 в 23:43
поделиться
  • 1
    Это единственное решение, которое действительно работает. Мне это действительно не нравится, но это крутое состояние, в котором мы сейчас находимся :-( – kentcdodds 20 March 2015 в 23:45
  • 2
    По состоянию на 2017 год эта работа все еще работает нормально. Для этого нужен только этот сценарий, чтобы принудительно input фокусироваться, если пользователь нажимает кнопку «поддельный». placeholder: $("label").on("click",function(){ $(this).prev().focus(); }); Обратите внимание, что label не может быть до input ... Chrome находит это! Хорошее творческое решение! +1 – Louys Patrice Bessette 30 March 2017 в 20:38

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

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

Установите значения входов к примеру для вашего пользователя (например, your@email.com) или метки поля (например, Email) и добавить к вашим входам класс, называемый focus-select:

<input type="text" name="email" class="focus-select" value="your@email.com">
<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, чтобы ваши другие разработчики не Не удаляйте его! Также убедитесь, что имя скрытого ввода релевантно.

16
ответ дан rybo111 17 August 2018 в 23:43
поделиться
  • 1
    Отличное решение (вариант 2), работало для меня. Благодарю. – AlexioVay 17 June 2015 в 14:11
  • 2
    @Vaia - вы пробовали перейти на другую страницу, а затем нажать кнопку «Назад»? Я получаю смешанные результаты - может потребоваться настройка. – rybo111 17 June 2015 в 14:13
  • 3
    Я не пробовал вариант 1, если вы имеете в виду это. Также мне нужно было отключить автозаполнение на загружаемом ajax модуле, который не будет вызываться с помощью кнопки «Назад». Но если будут другие результаты, я скажу вам. @ rybo111 – AlexioVay 17 June 2015 в 14:19
  • 4
    @Vaia Я имел в виду вариант 2 - ответьте здесь, если у вас возникнут какие-либо проблемы. Благодарю. – rybo111 17 June 2015 в 14:20

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

В поле ввода html после этого будут отключены оба.

Role="presentation" & autocomplete="off"

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

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

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

3
ответ дан Shoaib Khan 17 August 2018 в 23:43
поделиться

Использовать 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;
}
6
ответ дан Stiffels 17 August 2018 в 23:43
поделиться
  • 1
    как насчет безопасности? он работает, но для хорошего решения – Palaniichuk Dmytro 18 January 2018 в 16:40
  • 2
    лучший подход, который я нашел до сих пор! ну, по крайней мере, для Chrome 64: / – scipper 1 February 2018 в 14:34

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

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

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

42
ответ дан Tauras 17 August 2018 в 23:43
поделиться

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

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

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

585
ответ дан tibalt 17 August 2018 в 23:43
поделиться

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

$(document).ready(function(e) {
    if ($.browser.webkit) {
        $('#input_id').val(' ').val('');
    }
});
3
ответ дан user3638028 17 August 2018 в 23:43
поделиться
Другие вопросы по тегам:

Похожие вопросы: