Урок 18
Поля форм и свойство value

Концепция

Сегодня мы продолжим начатое в Уроке 17. Будем передавать в функцию данные, которые пользователь введет в поле формы. Затем эти данные будут использованы для поиска в Yahoo.

Скрипт

<SCRIPT LANGUAGE="JavaScript">
function Gofindit()
{
var search = document.formsearch.find.value;
{
var searchUrl = "http://av.yahoo.com/bin/query?p=" + search;
location.href = searchUrl;}}
</SCRIPT>
<FORM NAME="formsearch">Найдите в Yahoo:
<INPUT NAME="find" SIZE="40" TYPE="text">
<INPUT TYPE="button" VALUE="Искать" onClick="Gofindit()">
</FORM>

Разбор скрипта

От вас снова потребуется четкое понимание иерархии объектов.

• Во-первых, создаем функцию с переменной search(искать), которая будет результатом чего-то, происходящего в объекте document, под названием formsearch, внутри элемента find (найти), который обладает свойством value(значение).
• Вторую функцию помещаем внутри первой. Видите вторую пару {фигурных скобок}?
• Для второй функции создаем еще одну переменную searchUrl, представляющую собой адрес поисковой машины Yahoo плюс значение переменной search, полученное через команду document.formsearch.find.value.
• Наконец, location.href приравнивается к переменной searchUrl. После выполнения функции пользователь попадет на итоговую страницу.
• Теперь переходим к командам формы. Их две: текстовое поле, куда пользователь вводит свой запрос, и кнопка, запускающая функцию.
• Обратите внимание, что форма в целом получила имя formsearch. Помните, что мы говорили об иерархии объектов?
• Затем называем текстовое поле find. Опять иерархия. Видите, как мы идем от большого к малому?
• Дальше соединяем кнопку с командой onClick, которая запускает функцию.
• Наконец заканчиваем командой </FORM>. Готово.

Ваше задание

Измените скрипт так, чтобы он вызывал другую поисковую систему. И еще, пусть при подаче запроса выскакивает окошко с надписью «Сейчас поищем...»

Возможный ответ здесь