JavaScript имеет возможности, которые позволяют осуществлять вывод информации на панель состояния (мы будем пользоваться терминами "строка состояния" и "панель состояния" как синонимами, не делая между ними различия).
Панель состояния находится на нижней части рамки окна браузера. Для того, чтобы вывести текстовую строку на панель состояния необходимо присвоить window.status значение, равное этой строке.
Задание:
Создать Java-скрипт, осуществляющий запись и уничтожение текста на панели состояния.
Выполнение:
1) разместить в новом HTML-документе кнопку с именем look, и надписью Пишем на панель состояния!
2) разместить в этом же HTML-документе кнопку с именем erase и надписью на кнопке Стираем текст с панели состояния!
3) для кнопки с именем look создать обработчик события onClick, в котором записать следующий код: statbar(‘Вот она, панель состояния!’);
4) для кнопки с именем erase создать обработчик события onClick, в котором записать следующий код: statbar(‘ ’);
5) в теле HTML-документа разместите Java-скрипт содержащий следующую функцию:
function statbar(txt ) {
window.status = txt ;
}
6) сохраните HTML-документ и проверьте работоспособность скрипта.
Рисунок 4 – Результат выполнения скрипта.
Пояснение:
При нажатии на кнопку Пишем на панель состояния на панели состояния, расположенной в нижней части окна браузера, появляется текст: Вот она, панель состояния!
Здесь мы создаем форму с двумя кнопками. Обе кнопки приводят к обращению к функции statbar(). Кнопка Пишем на панель состояния! приводит к исполнению следующей функции: statbar('Вот она, панель состояния!');
В скобках мы записали выражение Это и есть панель состояния. Эта строка передается для обработки функции в виде параметра. Сама функция statbar() была определена нами следующим образом:
function statbar(txt ) {
window.status = txt ;
}
Здесь мы поместили в скобки выражение txt, параметр функции. Это значит, что строчное выражение, которое будет передано для обработки функции, будет храниться в переменной с именем txt. Передача значений функции с помощью переменных позволяет использовать функции наиболее гибким способом.
Функции можно передавать несколько переменных, для этого в списке переменные должны быть отделены друг от друга при помощи запятой. Значение переменной txt, т.е. строчное выражение, присвоенное этой переменной, можно вывести на панель состояния при помощи команды window.status = txt. Стирание текста с панели состояния осуществляется путем присвоения window.status пустой строки.
Использование возможности вывода текстовой информации на панель состояния полезно использовать в сочетании с гипертекстовыми ссылками. Вместо URL-адреса на панель состояния можно вывести краткую информацию о содержании страницы, на которую имеется ссылка.
Задание:
Реализовать возможность изменения текста строки состояния, при наведении курсора на гиперссылку.
Выполнение:
1) в ранее созданном HTML-документе, разместить гиперссылку на сайт университета;
2) изменить открывающий тег гиперссылки, руководствуясь нижеследующим примером:
3) сохранить HTML-документ и проверить правильность выполнения скрипта.
Пояснение:
Рисунок 5 – Результат выполнения скрипта.
Для того, чтобы определить, где находится указатель мыши, мы использовали onMouseOver и onMouseOut. Сообщение Не нажимай на меня! появляется, тогда, когда указатель мыши находится на ссылке. Возможно, Вас удивило, что внутри скобок в выражении, присваиваемом свойству onMouse, указано return true. Эта инструкция заставляет браузер отказаться от выполнения собственных, свойственных браузеру действий в момент наступления данного события.
Обычно, когда указатель мыши находится на той или иной ссылке, браузер выводит на панель состояния адрес ссылки, ее URL. Если мы не напишем return true, то немедленно после того, как будет выполнена наша команда, т.е. на панель состояния будет выведен заданный нами текст Не нажимай на меня!, браузер вернется в свое стандартное состояние и запишет на панель состояния URL данной ссылки. Наша строка будет перезаписана, и мы не сможем ее прочитать. Во избежание этого в средстве обработки событий мы пишем инструкцию return true.
