Практическое занятие

Задание

Создадим на новой веб-странице Анкету. Разместим поля для ввода фамилии, имени, даты рождения, телефона, электронной почты и так далее. В конце анкеты разместим чекбокс для запроса согласия на обработку персональных данных. Сделаем часть полей обязательными для заполнения. В конце анкеты добавим кнопку Отправить и кнопку Очистить

Напишем html-код.

     <form onSubmit="return ttt()">
         <p>Фамилия<sup>*</sup> &nbsp;<input type="text" required placeholder="Иванов"> </p>
         <p>Имя<sup>*</sup> &nbsp;<input type="text" required placeholder="Иван"> </p>
         <p>Дата рождения<sup>*</sup> &nbsp; <input type="date"  required> </p>
         <p>Пол<sup>*</sup> &nbsp;
                <select name="pol" required>
                    <option value=1>мужской
                    <option value=2>женский
                </select>
         </p>
         <p>Контактный телефон &nbsp;<input type="tel" placeholder="8-123-467-8901" pattern="[0-9]{1}-[0-9]{3}-[0-9]{3}-[0-9]{4}"></p>
         <p>E-mail &nbsp;<input type="email"></p>
         <p> <span style="vertical-align:middle">В какие сроки желаете работать &nbsp;</span>
                <select multiple style="vertical-align:middle">
                    <option value=1>1 смена
                    <option value=2>2 смена
                    <option value=3>3 смена
                    <option value=4>4 смена
                </select>
         </p>
         <p><input type="checkbox" required value="checked"> Согласен/согласна на автоматизированную обработку персональных данных</p>
         <p><input type="submit" value="Отправить">
            <input type="reset" value="Очистить"></p>
     </form>

Добавим небольшой скрипт для реакции на нажатие кнопки Отправить

<script type="text/javascript">
    function ttt() {
          alert ("Отправлено")
          return false
}



Последнее изменение: Вторник, 18 февраля 2020, 23:45