Использование элемента input для получения поисковых терминов
Тип search элемента input представляет пользователю однострочное текстовое поле для ввода поисковых терминов. Это необычный тип input, потому что он на самом деле ничего не делает. Тут нет никаких встроенных ограничений на данные, которые может ввести пользователь, и нет никаких специальных функций, таких как поиск по данной странице или использование пользовательского поискового движка для выполнения поиска. Этот тип элемента input поддерживает те же дополнительные атрибуты, что и тип text. В листинге 13-14 показано, как он используется.
Листинг 13-14: Использование типаsearchэлементаinput
<!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 method="post" action="http://titan:8080/form">
<p>
<label for="name">
Name:
<input value="Adam" id="name" name="name" />
</label>
</p>
<p>
<label for="password">
Password:
<input type="password" placeholder="Min 6 characters"
id="password" name="password" />
</label>
</p>
<p>
<label for="fave">
Favorite Fruit:
<input type="text" id="fave" name="fave" />
</label>
</p>
<p>
<label for="search">
Search:
<input type="search" id="search" name="search" />
</label>
</p>
<input type="submit" value="Submit Vote" />
</form>
</body>
</html>Браузеры сами решают, как отображать текстовое поле таким образом, чтобы стало очевидно, что вы собираете данные для поиска. Google Chrome представляет стандартное текстовое поле, куда пользователь может набирать текст, и тут есть значок отмены, как показано на рисунке 13-18. На момент написания этой книги другие основные браузеры работали с этим типом элемента input, как будто это обычный тип text.
Рисунок 13-18: Как Google Chrome отображает типsearchэлементаinput
