На тот или иной элемент формы

При помощи метода focus() мы имеем возможность сделать нашу форму более удобной для пользователя. Мы сможем подсказать пользователю, на какую форму следует обратить внимание первым делом. Или же мы сможем подсказать пользователю и обратить его внимание на тот элемент, в котором был введен неправильный текст или допущена ошибка.

Это осуществляется при помощи того, что браузер устанавливает курсор в тот элемент, на который мы указываем посредством программы, использующей метод focus(). Метод focus() как бы фокусирует внимание пользователя на определенном элементе формы, на котором устанавливается курсор.

Задание:

Изменить HTML-документ, созданный в предыдущем задании, таким образом, чтобы после загрузки документа курсор автоматически устанавливался на поле для ввода.

Для этого необходимо написать скрипт, осуществляющий проверку ввода телефонного номера на наличие недопустимых символов.

Выполнение:

1) добавить в ранее созданный HTML-документ следующую функцию:

function setfocus( )

{

document.first.text1.focus( ) ;

}

2) изменить тег <body>, добавив в него вызов функции setfocus(), следующим образом: onLoad="setfocus()";

3) сохранить HTML-документ;

4) проверить работу скрипта, открыв созданный HTML-документ в браузере.

Пояснение:

При помощи вызова функции setfocus() мы устанавливаем курсор в первом элементе выше написанного скрипта на JavaScript. Нам необходимо указать имя всей формы, которое в нашем случае представляет собой first, а затем указать имя текстового элемента данной формы — text1.

Для того чтобы курсор устанавливался в текстовом элементе этой формы сразу после загрузки страницы, мы используем свойство onLoad внутри действия тега <body>.

Мы можем слегка усложнить нашу функцию setfocus() следующим образом:

function setfocus() {

document.first.text1.focus();

document.first.text1.select();}

Рисунок 15 – Результат выполнения скрипта.

Попробуйте данную программу в работе. Вы увидите, что курсор устанавливается в текстовом элементе формы и осуществляется выделение содержащихся в текстовом поле данных.

Литература

1. Дэвид Макфарланд JavaScript. Подробное руководство JavaScript: The Missing Manual, серия: Компьютер на 100%, изд-во: Эксмо, 2009 г., 608 с.

ISBN 978-5-699-34659-2, 978-0-596-51589-8

2. Дэвид Флэнаган JavaScript. Подробное руководство JavaScript: The Definitive Guide // Изд-во: Символ-Плюс, 2008 г., 992 с.

ISBN 5-93286-103-7, 978-5-93286-103-5, 0-596-10199-6

3. Александр Климов JavaScript на примерах // Серия: На примерах, изд-во: БХВ-Петербург, 2009 г., 336 с. ISBN 978-5-9775-0361-7

4. Том Негрино, Дори Смит JavaScript // Серия: Quick Start, изд-во: НТ Пресс, 2007 г., 544 с., ISBN 5-477-00390-1, 0-321-19439-X

5. Виктор Вахтуров JavaScript. Освой на примерах (+ CD-ROM)

Изд-во: БХВ-Петербург, 2007 г., 400 с., ISBN 978-5-94157-877-1

6. Мэрдок, Келли Л. JavaScript: наглядный курс создания динамических Web-страниц. : Пер. с англ. : Уч. пос. — М. : Издательский дом "Вильяме", 2001. — 288 с.

7. Дунаев В. Самоучитель JavaScript, 2-е изд. — СПб.: Питер, 2005. — 395 с.

8. Д. Лещев Создание интерактивного web-сайта: учебный курс. — СПб.: Питер, 2003. — 544 с.: ил.

9. Робин Ноблес, Керри-Лэй Греди.Эффективный Web-сайт. Учебное пособие.— М,: Издательство ТРИУМФ, 2004 — 560с.: ил.

10. ВАЙК Аллен и др.JavaScript. Энциклопедия пользователя: Пер.с англ./Аллен Вайк.— К.: ООО "ТИД" ДС", 2001.— 480с.

Учебное издание

Степанов Александр Васильевич

Степанов Юрий Александрович

Дмитриев Юрий Владимирович