Работа с элементами вне формы
В HTML4 элементы input, button и другие, связанные с формой элементы, должны были содержаться внутри элемента form, как я показал во всех предыдущих примерах этой главы. В HTML5 это ограничение было снято, и вы можете связать элементы с формами в любом месте документа. Это делается при помощи атрибута form, который определяется input, button и другими, связанным с формой, элементами, о чем я расскажу в главе 14. Чтобы связать элемент с формой (form), которая не является предшествующей, вы просто устанавливаете атрибуту form значение id формы. В листинге 12-18 представлен пример.
Листинг 12-18: Использование атрибута form<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
<meta name="author" content="Adam Freeman" />
<meta name="description" content="A simple example" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
<body>
<form id="voteform" method="post" action="http://titan:8080/form">
<p>
<label for="fave">Fruit:
<input autofocus id="fave" name="fave" /></label>
</p>
</form>
<p>
<label for="name">
Name:
<input form="voteform" id="name" name="name" />
</label>
</p>
<button form="voteform" type="submit">Submit Vote</button>
<button form="voteform" type="reset">Reset</button>
</body>
</html>
В этом примере только один из элементов input является потомком элемента form. Другой элемент input и оба элемента button находятся вне элемента form, но они используют атрибут form, чтобы связать себя с формой.
