Блог веб разработки

Блог веб-разработки статьи | видеообзоры | исходный код

autocomplete html

Всем привет. Формы являются важной составляющей любого интернет ресурса и поэтому нужно максимально упрощать работу с ними. И именно для этого в стандарт html было введено автозаполнение полей форм:

Давайте рассмотрим пример:

<form method="post" action="/">
    <input placeholder="Введите login " name="login" type="text" required />
    <br>
    <br>
    <input type="password" name="password" placeholder="Введите пароль" required>
    <br>
    <br>
    <button>
        Отправить
    </button>
</form>

Здесь у нас есть некая форма авторизации. Допустим мы авторизуемся под логином 'uhrufhu'. И теперь в следующий раз когда мы захотим авторизоваться и начнем вводить логин. У нас внизу подсветиться подсказка в виде выпадающего списка в которой будет содержаться наш логин. То есть, нам не придется вводить логин полностью, а достаточно будет выбрать значение из списка. Это и есть, то самое автозаполнение полей форм которое можем облегчить работу пользователя.

Заметьте что в поле с типом 'password' автозаполнение не работает. Это сделано для безопасности.

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

К счатью автозаполнение можно отменять.

Пример:

<input placeholder="Введите  проверочный код" name="captcha" type="text" required autocomplete="off"/>

Здесь у нас поле для ввода кода капчи и мы отменили автозаполение данного поля с помощью свойства 'off' атрибута autocomplete.

Именно атрибут autocomplete и отвечает за автозаполнение поля формы. По умолчанию данный атрибут имеет значение 'on', то есть автозаполнение включено:

<input placeholder="Введите login " name="login" autocomplete="on"  type="text" required />

В принципе autocomplete="on" можно не указывать, так как автозаполнение работает по умолчанию.

Но если мы хотим от него избавится, нам достаточно прописать в качестве атрибута autocomplete="off" и автозаполнение в данном поле перестанет работать.

На этом данная статья подошла к концу. Скажу что помимо значений 'on' и 'off ' атрибут autocomplete может принимать и другие значения( autofill detail tokens). Более подробную информацию о них вы можете найти на Хабре https://habrahabr.ru/company/mailru/blog/301840/ .

Я с вами прощаюсь. Желаю успехов и удачи! Пока!

Оцените статью

Еще статьи

Javascript генераторы

PHP типы данных

Переменные окружения PHP

входные данные PHP

произношение javascript

parse_url() и parse_str() php

MediaRecorder

requests python

Broadcast Channel

Комментарии

Проверочный код

В данном разделе пока нет комментариев!

История

    ПОДПИСКА

    • Подпишись и получай информацию о выходе новых статей на почту! Просто введите свою почту, нажмите кнопку подписаться. На почту должно будет прийти сообщение с потверждением подписки. Если сообщение не пришло проверьте раздел спам или попробуйте другую почту. Также по всем техническим проблемам вы можете написать в поддержку

    НОВОСТИ

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