Это цитата сообщения FlashStudio Оригинальное сообщение
Формы по шагам: Переход между полями с помощью табуляции
При достаточно большом количестве полей формы, которые необходимо заполнить, переходить между ними с помощью курсора мыши становится утомительно. При этом требуется навести курсор на соответствующее поле, нажать кнопку мыши, и только после этого вводить нужное значение. Как альтернатива, используется клавиша <Tab>, которая позволяет быстро переключать фокус с одного поля на другое. Параметр tabindex определяет последовательность перехода между полями при нажатии на <Tab>.
Замечание
Фокусом называется активность поля, иными словами, поле доступно для того, чтобы в него вводили информацию или использовали какое другое действие. Например, кнопки, флажки, переключатели можно активизировать с помощью пробела.
Следующие поля формы (теги) могут иметь параметр tabindex: <BUTTON>, <INPUT>, <SELECT>, <TEXTAREA>. В качестве значения принимается число, которое представляет собой шаг перехода. Так, номер 1 означает, что это поле первое получит фокус, номер 2 будет идти следующим и т.д. В примере 14.1 показано применение параметра tabindex когда поля формы размещаются в ячейках таблицы. Если значение tabindex не указано, то по умолчанию переход по элементам формы происходит так, как они расположены в коде HTML, т.е. сверху вниз.
Пример 14.1. Использование параметра tabindex
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Порядок полей</title>
</head>
<body>
<form name="bio" method="POST" action="handler.php">
<table width="100%" cellspacing="0" cellpadding="4">
<tr valign="top">
<td >
Ваше имя:<br> <input name="name" type="text" tabindex="1" size="30">
</td>
<td>
Фамилия:<br> <input name="lastname" type="text" tabindex="3" size="30">
</td>
</tr>
<tr valign="top">
<td>
Телефон:<br>
<input name="tel" type="text" tabindex="2" size="30">
</td>
<td>
Пол:<br>
<select name="gender" tabindex="4">
<option selected>Мужской</option>
<option>Женский</option>
<option>Гермафродит</option>
</select></td>
</tr>
</table>
</form>
</body>
</html>Результат примера показан ниже. Обратите внимание, что с помощью табуляции фокус вначале получает поле, где надо ввести имя, а затем поле для ввода телефона.