Есть ли W3C действительный способ отключить автозаполнение в форме HTML?

424

При использовании xhtml1-transitional.dtddoctype, собирая номер кредитной карты со следующим HTML

<input type="text" id="cardNumber" name="cardNumber" autocomplete='off'/>

отметит предупреждение на валидаторе W3C:

нет атрибута "автозаполнение".

Существует ли W3C / стандартный способ отключить автозаполнение браузера для чувствительных полей в форме?

html standards forms w3c Мэтт Б
источник
10
Вы уверены, что возиться с настройкой автозаполнения пользователя - это то, что вы хотите сделать? Если у них это включено, им, вероятно, понравится. Автозаполнение является полностью особенность браузера на стороне, так же, как кнопка , которая позволяет пользователю изменять размер шрифта и т.д. Вы не должны мешать их пожелания
rmeador
113
Даже для чего-то такого же чувствительного, как номер кредитной карты? Я не могу вспомнить очень многих людей, которые хотели бы, чтобы это запомнили, тем более что автозаполнение по умолчанию включено в большинстве браузеров. Если они хотят, чтобы это запомнилось так плохо, они могут использовать что-то, что заполняет формы, такие как панель инструментов Google.
Matt B
13
Мой вариант использования немного отличается - я запускаю собственное автозаполнение и не хочу, чтобы оно конфликтовало с браузером. Я только что обнаружил, что autocomplete = "off" недопустимо, но, похоже, другого простого решения нет (впрыскивать его с помощью js просто глупо)
thepeer
13
@ rmeador, потому что иногда мы хотим предоставить более удобную для пользователя альтернативу стандартному автоматическому предложению. @corydoras, пожалуйста, не увеличивайте вес OSX, это не поможет в решении этого вопроса.
Джош М.
12
Проблема заключается в том, что банки будут нести ответственность продавца, если произошла мошенническая транзакция ... даже если его ошибка на 100%. Поэтому в некоторых случаях законно отключить эту функцию для клиента.
Александр Х. Тремблей

Ответы:

422

Вот хорошая статья из MDC, которая объясняет проблемы (и решения) для формирования автозаполнения. Microsoft опубликовала нечто подобное и здесь .

Если честно, если это что-то важное для ваших пользователей, то «нарушение» стандартов таким образом представляется целесообразным. Например, Amazon довольно часто использует атрибут autocomplete, и, похоже, он работает хорошо.

Если вы хотите полностью удалить предупреждение, вы можете использовать JavaScript, чтобы применить атрибут к браузерам, которые его поддерживают (IE и Firefox являются важными браузерами), используя someForm.setAttribute( "autocomplete", "off" ); someFormElm.setAttribute( "autocomplete", "off" );

Наконец, если ваш сайт использует HTTPS, IE автоматически отключает автозаполнение (как и некоторые другие браузеры, насколько я знаю).

Обновить

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

Ник преста
источник
41
Похоже, что Firefox не отключает автозаполнение на https, но это полезный опыт. Спасибо!
Matt B
3
Safari не поддерживает атрибут autocomplete = "off". См stackoverflow.com/questions/22817801/...
Skurpi
1
autocompleteможно использовать не только для formэлемента , но и offзначение работает как минимум вchromium-40.0.2214.115
x-yuri
W3C, похоже, расширяет стандарты автозаполнения в HTML5.1 (в черновике на момент написания этого комментария) w3c.github.io/html/…
Джастин Нафе,
1
Если ничего не работает, используйте текстовое поле вместо текстового поля, чтобы отключить автозаполнение.
Бсиенн
64

Я был бы очень удивлен, если бы W3C предложил способ, который будет работать с (X) HTML4. Функция автозаполнения полностью основана на браузере и была представлена ​​в последние годы (задолго до того, как был написан стандарт HTML4).

Не удивлюсь, если у HTML5 будет такой.

Изменить: Как я думал, HTML5 делает есть что особенность. Чтобы определить свою страницу как HTML5, используйте следующий тип документа (то есть: поместите это как самый первый текст в вашем исходном коде). Обратите внимание, что не все браузеры поддерживают этот стандарт, так как он все еще находится в черновом варианте.

<!DOCTYPE html>
Хенрик Пол
источник
7
Все браузеры ожидают поддержки старых версий Konqueror. Даже IE6 поддерживает это. Это учение идти.
BalusC
56

HTML 4 : нет

HTML 5 : да

Атрибут autocomplete является перечисляемым атрибутом. Атрибут имеет два состояния. На ключевых слова , карты в включенном состоянии, и от ключевого слова карты в отключенном состоянии. Атрибут также может быть опущен. Недостающее значение по умолчанию является на состояние. Состояние off указывает, что по умолчанию для элементов управления формы в форме для имени поля автозаполнения установлено значение off ; состояние «включено» означает, что по умолчанию для элементов управления формы в имени их autofillполя установлено значение «вкл».

Ссылка: W3

RuudKok
источник
@ freestock.tk Да, это яснее, чем все остальные. Простота имеет значение.
OverCoder
32

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

Если бы вы дали полю ввода имя типа " email_<?= randomNumber() ?>", а затем получили скрипт, который получает этот цикл данных через переменные POST или GET, ища что-то, совпадающее с шаблоном " email_[some number]", вы можете выполнить это, и это будет иметь ( практически) гарантированный успех вне зависимости от браузера .

Призрак Ватсон
источник
6
Это усложнит автоматическое тестирование.
Дэвид Уотерс
14
Это усложнит автоматическое тестирование, только если ваша тестирующая программа не справится с проверкой / чтением полей, к которым может быть добавлено случайное число. Возможно, пришло время обновить программное обеспечение для автоматического тестирования.
коридорас
8
Информация автозаполнения все равно будет сохранена в каталоге данных браузера, не так ли?
Джои Адамс
2
Предположительно. Но не ожидалось, что он когда-нибудь снова появится у пользователя.
Призрак Уотсон
1
В Chrome теперь используется атрибут type = "password", а не атрибут name для определенного сайта. У меня есть name = "newpassword" autocomplete = 'off' type = "password", и он заполняется автоматически! Если я изменю тип, автозаполнение не будет
Enigma Plus
31

Нет, хорошая статья здесь, в Mozila Wiki .

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

Дэвид Уотерс
источник
23

Как насчет установки его с помощью JavaScript?

var e = document.getElementById('cardNumber');
e.autocomplete = 'off'; // Maybe should be false

Это не идеально, но ваш HTML будет действительным.

Greg
источник
8
Использование javascript в качестве обходного пути к ошибкам проверки похоже на выметание пыли под ковром. Хотя HTML-документ может стать действительным, конечная страница HTML + JS не будет.
Фреганте
11

Если вы используете jQuery, вы можете сделать что-то вроде этого:

$(document).ready(function(){$("input.autocompleteOff").attr("autocomplete","off");});

и используйте класс autocompleteOff, где вы хотите:

<input type="text" name="fieldName" id="fieldId" class="firstCSSClass otherCSSClass autocompleteOff" />

Если вы хотите, чтобы ВСЕ ваши входные данные были autocomplete=off, вы можете просто использовать это:

$(document).ready(function(){$("input").attr("autocomplete","off");});
Totoche
источник
4
Просто использовать HTML5 doctype легче и лучше.
BalusC
5
в любом случае это не совсем корректный html, это просто установка autocompleteатрибута (недопустимого) иначе, чем в html
matt b
Этот код не работает для меня; Я использовал, $('input.autocompleteOff').val('');который, кажется, в порядке.
DQD
5
Использование javascript в качестве обходного пути к ошибкам проверки похоже на выметание пыли под ковром. Хотя HTML-документ может стать действительным, конечная страница HTML + JS не будет.
Фреганте
8

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

Еще один вопрос, касающийся вопроса rmeador о том, следует ли вам вмешиваться в работу браузера: мы разрабатываем системы Contact Management и CRM, и когда вы вводите данные других людей в форму, вы не хотите, чтобы они постоянно предлагали ваши собственные данные.

Это работает для наших нужд, но тогда мы можем позволить себе получить хороший браузер :)

autocomplete='off'
Энигма Плюс
источник
8

autocomplete="off" это должно решить проблему для всех современных браузеров.

<form name="form1" id="form1" method="post" autocomplete="off"
   action="http://www.example.com/form.cgi">
  [...]
</form>

В текущих версиях браузеров Gecko атрибут autocomplete работает отлично. В более ранних версиях, начиная с Netscape 6.2, он работал с исключением форм с «Адрес» и «Имя».

Обновить

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

autocomplete="nope"

Поскольку это случайное значение не является valid one, браузер сдастся.

Documetation

Эмилио Горт
источник
Современные браузеры не принимают autocomplete = off по выбору. :/ К несчастью.
Alexus
@Alexus добавил некоторые обновления ... Интернет очень быстро меняется
Эмилио Горт
6

Использование случайного атрибута 'name' работает для меня.

Я сбрасываю атрибут имени при отправке формы, чтобы вы могли получить к нему доступ по имени при отправке формы. (используя атрибут id для хранения имени)

opznhaarlems
источник
5

Обратите внимание, что существует некоторая путаница с расположением атрибута autocomplete. Его можно применять либо ко всему тегу FORM, либо к отдельным тегам INPUT, и это не было действительно стандартизировано до HTML5 (что явно разрешает оба местоположения ). В более старых документах в этой статье Mozilla упоминается только тег FORM. В то же время некоторые сканеры безопасности будут искать автозаполнение только в теге INPUT и сообщать, если он отсутствует (даже если он находится в родительской ФОРМЕ). Более подробный анализ этого беспорядка размещен здесь: Путаница по атрибутам AUTOCOMPLETE = OFF в формах HTML .

kravietz
источник
3

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

Не уверен, сработает ли это или нет, была просто мысль.

Кирон
источник
2

Я думаю, что есть более простой способ. Создайте скрытый вход со случайным именем (через javascript) и установите для него имя пользователя. Повторите с паролем. Таким образом, ваш серверный сценарий точно знает, какое имя соответствующего поля, сохраняя автозаполнение в темноте.

Я наверное не прав, но это всего лишь идея.

Змеи и кофе
источник
2 
if (document.getElementsByTagName) {
    var inputElements = document.getElementsByTagName("input");
    for (i=0; inputElements[i]; i++) {
        if (inputElements[i].className && (inputElements[i].className.indexOf("disableAutoComplete") != -1)) {
            inputElements[i].setAttribute("autocomplete","off");
        }
    }
}
Джек Так
источник
-1

Это решение работает со мной:

$('form,input,select,textarea').attr("autocomplete", "nope");

если вы хотите использовать автозаполнение в этом регионе: добавьте autocomplete="false"элемент ex:

<input id="search" name="search" type="text" placeholder="Name or Code" autcomplete="false">
Хонг Трон
источник
-5

Действительное автозаполнение выключено

<script type="text/javascript">
    /* <![CDATA[ */
    document.write('<input type="text" id="cardNumber" name="cardNumber" autocom'+'plete="off"/>');
    /* ]]> */ 
</script>
Саутгемптон Веб-дизайн
источник
13
конечно, если пользователь отключил JS, он не может выполнить заказ, так как не может ввести номер своей карты? Лучше дополнить атрибут через JS, я бы сказал - в худшем случае JS off дает поле номера карты с возможностью автоматического заполнения, но, по крайней мере, они могут разместить заказ ... просто мысль :)
Terry_Brown
3
Это даже не смешно.
Рикардо Пипер