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

https://stackoverflow.com/questions/582244

06-09-2019
|

Вопрос

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

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

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

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

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

Решение

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

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

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

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

Обновить

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

Другие советы

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

Хотя не удивился бы, если бы в HTML5 он был.

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

<!DOCTYPE html>

HTML 4:НЕТ

HTML 5:ДА

Атрибут автозаполнения - это перечисляемый атрибут.Атрибут имеет два состояния.В на ключевое слово соответствует включенному состоянию, а ВЫКЛ ключевое слово соответствует выключенному состоянию.Атрибут также может быть опущен.В отсутствующее значение по умолчанию равно на государство.В ВЫКЛ состояние указывает, что по по умолчанию элементы управления формы в форме будут иметь имя поля автозаполнения установлено в ВЫКЛ;включенное состояние указывает, что по умолчанию элементы управления формой в форма будет иметь свои autofill для имени поля установлено значение "вкл.".

Ссылка: W3

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

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

Нет, хорошая статья есть здесь, в Мозила Вики.

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

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

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

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

Я предлагаю использовать все 4 типа входных данных:

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

Ссылка:

Если вы используете 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");});

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

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

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

autocomplete='off'

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

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

В текущих версиях браузеров Gecko атрибут автозаполнения работает отлично.Для более ранних версий, начиная с Netscape 6.2, это работало, за исключением форм с "Адресом" и "Именем".

Обновить

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

autocomplete="nope"

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

Документирование

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

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

Обратите внимание, что существует некоторая путаница в расположении атрибута автозаполнения.Он может быть применен либо ко всему тегу ФОРМЫ, либо к отдельным тегам ввода, и это на самом деле не было стандартизировано до HTML5 (что явно позволяет и то, и другое Адреса).Старые документы, в частности это Статья в Mozilla упоминает только тег ФОРМЫ.В то же время некоторые сканеры безопасности будут искать автозаполнение только в теге ввода и жаловаться, если он отсутствует (даже если он является в родительской ФОРМЕ).Более подробный анализ этого беспорядка опубликован здесь: Путаница из-за АВТОЗАПОЛНЕНИЯ = отключенных атрибутов в HTML-формах.

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

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

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

Возможно, я ошибаюсь, но это всего лишь идея.

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");
        }
    }
}

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

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

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

<input id="search" name="search" type="text" placeholder="Name or Code" autcomplete="false">

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

<script type="text/javascript">
    /* <![CDATA[ */
    document.write('<input type="text" id="cardNumber" name="cardNumber" autocom'+'plete="off"/>');
    /* ]]> */ 
</script>

Лицензировано под: CC-BY-SA с атрибуция

Не связан с StackOverflow