HTML input
Сегодня мы продолжаем тему создания форм, рассмотрим тег input и его основные значения. Начнем с типа text, который мы уже с Вами использовали. Данный тип является текстовым полем, которое можно использовать в различных ситуациях, например при вводе имени, фамилии, логина.
<html>
<head>
<title>Тег input</title>
</head>
<body>
<form name="my_form" action="#" method="post">
Введите имя: <input type="text" name="login" />
</form>
</body>
</html>
Вторым типом тега input является password, который используется в качестве ввода пароля пользователя. Текст, который мы пишем в данном поле, является скрытым и мы его не увидим.
Введите пароль: <input type="password" name="pass" />
Следующий тип, является button, или обычная кнопка, при нажатии на которую, можно производить различные манипуляции, которые Вам в данном случае необходимо сделать.
<input type="button" name="butt" value="Кнопка" />
В результате мы получаем кнопку, на которую пользователь может нажать. В данном типе мы добавили еще один атрибут value, который отвечает за то, что будет написано на нашей кнопке.
Для того чтобы выбрать несколько вариантов ответа, которые будут отмечаться в виде галочки, существует тип checkbox, он также является довольно часто используемым в практике.
Вариант 1: <input type="checkbox" name="checkbox" value="check" />
Вариант 2: <input type="checkbox" name="checkbox1" value="check" />
Вариант 3: <input type="checkbox" name="checkbox2" value="check" />
Заметьте, что каждому чек боксу присвоено свое имя, чтобы при дальнейшей их обработке, можно было узнать, какие элементы выбрал пользователь. Если пользователь установил флажок, то переменной присваивается значение, которое находится в атрибуте value.
Для того чтобы загрузить файл на сервер, существует отдельный тип, который так и называется file. Пример его использования следующий, вы хотите загрузить фотографии в социальную сеть вконтакте, данный тип предназначен для выполнения данной операции.
<input type="file" name="file" />
В результате появляется кнопка, при нажатии на которую вы можете выбрать файл, который хранится на вашем компьютере.
Похожим вариантом на checkbox, является радиокнопка, однако она используется в том случае, когда необходимо выбрать один вариант ответа.
Один: <input type="radio" name="radio" value="one" />
Два: <input type="radio" name="radio" value="two" />
Три: <input type="radio" name="radio" value="three" />
В этом случае мы вводим одинаковые имена для кнопок, при выборе различных имен, мы сможем выбирать различные варианты, что не является совсем корректным. Атрибут value является атрибутом, который указывает значение данной переменной
Когда данные полностью заполнены пользователем, их необходимо отправить на сервер, для данной операции существует кнопка, которая отправляет все эти данные на сервер. Данный тип называется submit.
<form name="my_form" action="#" method="post">
<input type="submit" name="send" value="Отправить" />
</form>
Данный тип чем-то напоминает тип button, но это не так, при нажатии данной кнопки, мы переходим к скрипту обработчику, который мы указываем в атрибуте action тега формы. Вот мы и рассмотрели основные типы тега input, однако это не все что можно использовать. В HTML 5, появились еще дополнительные типы, но некоторое их использование полностью не поддерживается даже современными браузерами, но постепенно они внедряются. Некоторые из них можно использовать уже сейчас, а некоторые использовать пока что не стоит. В любом случае, в скором времени, мы будем полностью использовать данную технологию!
