2009-06-08

Автозаполнение в формах

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

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

Отключить автозаполение можно добавив атрибут autocomplete="off" причем поставить его можно как к тегу FORM так и к тегу INPUT.

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

Нельзя ли отключить автозаполнение посредством JavaScript? Замечено, что простым присваиванием значения autocomplete="off" к объекту DOM автозаполнение не убирается поэтому многие разработчики продолжают пользоваться введением атрибута в разметку — лучше поломать валидность чем секьюрность.

Однако на днях нашел элегантнейшее решение позволяющее оставить код валидным и отключить автозаполнение:

[domelement].setAttribute('autocomplete','off');

Свойства элементам DOM можно присваивать не только напрямую но и посредством метода setAttribute и это более рекомендумемый способ. Указанный метод работает в FF и IE в других пока не тестировал.

 

комментарии:

 
Белоногов Алексей (анонимный пользователь) | 2009-06-09

> Замечено, что простым присваиванием значения autocomplete="off" к объекту DOM автозаполнение не убираетс...

Ты под простым присвоением что понимаешь? Код с примером был бы очень кстати.

Атиух (анонимный пользователь) | 2009-06-10
При заполнении многочисленных форм на различных страничках иногда приходится по много раз вводить одни и те же значения - емайл адреса, пароли.
А в случае с паролями автозаполнение полезно и используется? 0_o
max | 2009-06-10
Ты под простым присвоением что понимаешь? Код с примером был бы очень кстати.

Пожалуйста:

<script type="text/javascript">
window.onload = function(){
    var form = document.getElementById('id_of_form'); 
    //form.autocomplete = 'off'; - это простое присваивание
    //оно работать не будет! поэтому закоментировано	
    form.setAttribute('autocomplete','off'); //вот это самое осовное
}
</script>

Конечно, нужно еще убедиться что какой нибудь другой скрипт не переопределяет onload для window, а лучше обезопасить себя и использовать что нибудь более надежное из арсенала jquery или prototype.

С использованием ztools это выглядело бы так:

<script type="text/javascript">
z.Document.ready(function(){
    z('id_of_form').origin.setAttribute('autocomplete','off'); 
})
</script>
Белоногов Алексей (анонимный пользователь) | 2009-06-15

Спасибо за пояснения.

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

Имя*

разрешены только теги br, font, span, p, strong, u, p, blockquote, a, div, img - остальные будут безжалостно удаляться