Непрофессиональное введение в Javascript

         

Строка состояния



Строка состояния

Ваши программы JavaScript могут писать в строку состояния - это область снизу вашего окна броузера. Все, что Вы должны сделать, это указать строку в window.status. Следующий пример показывает Вам две кнопки, которые могут использоваться, чтобы записать в строку состояния и опять стереть текст.

Сценарий выглядит следующим образом:

<html> <head> <script language="JavaScript"> <!-- hide function statbar(txt) { window.status = txt; } // --> </script> </head> <body> <form> <input type="button" name="look" value="Write!" onClick="statbar('Hi! This is the statusbar!');"> <input type="button" name="erase" value="Erase!" onClick="statbar('');"> </form> </body> </html>

Мы создаем форму с двумя кнопками. Обе кнопки вызывают функцию statbar(). Посмотрите, как выглядит обращение к функции, созданное кнопкой Write!:

statbar('Hi! This is the statusbar!');

Внутри скобок мы определяем строку 'Hi! This is the statusbar!' Это значит, что строка передаётся в функцию statbar(). Вы видите, что мы определили функцию statbar(), как показано ниже:

function statbar(txt) { window.status = txt; }

Что является новым - то, что мы используем txt внутри скобок имени функции. Это означает строка, которую мы передали в функциу, сохранена в переменной txt.
Передача переменных в функции - часто используемый путь для создания более гибких функций. Вы можете передавать несколько значений в функции - Вы только должны отделить их через запятые.


Строка txt отображается в строке состояния через window.status = txt.
Стирание текста в строке состояния - достигаеться через задание пустой строки в window.status.

Показ текста в строке состояния может легко использоваться в комбинации с ссылками. Вместо того, чтобы показывать URL связи Вы можете объяснять на словах, относительно чего следующая страница. Эта ссылка показывает это - только переместите ваш курсор поверх ссылки. Код для этого примера выглядит следующим образом:

<a href="dontclck.htm" onMouseOver="window.status='Don\'t click me!'; return true;" onMouseOut="window.status='';">link</a>

Здесь мы используем onMouseOver и onMouseOut, чтобы обнаружить, когда курсор перемещается поверх ссылки.
Вы можете задать вопрос, почему мы должны писать return true внутри свойства onMouseOver. Это означает, что броузер не будет выполнять собственный код как реакцию на событие MouseOver. Обычно броузер отображает URL ссылки в строке состояния. Если мы не используем return true, броузер будет писать в строку состояния сразу после того, как наш код был выполнен - это означает, что броузер записало поверх нашего текста, и пользователь не смог бы прочитать его. В общем, мы можем подавить такие действия броузера, используя return true в обработчике событий.
onMouseOut не существовал в JavaScript 1.0. Если Вы используете Netscape Navigator 2.x, Вы можете получить различные результаты на различных платформах. На Unix платформах например текст исчезнет даже при том, что броузер не знает onMouseOut. В Windows текст останется. Если Вы хотите, чтобы ваш сценарий был совместимым с Netscape 2.x для Windows, Вы могли бы например писать функцию, которая пишет текст в строку состояния и стирает этот текст после некоторого периода времени. Это программируется с использованием таймаутов. Мы узнаем больше относительно таймаутов в следующем разделе.
В этом сценарии Вы можете видеть другую вещь - иногда Вы хотите вывести кавычки. Мы хотим вывети строку Don't click me - поскольку мы определяем эту строку внутри onMouseOver обработчика событий, мы используем одиночные кавычки. Но слово Don't тоже использует одиночную кавычку! Броузер запутается, если Вы просто напишете 'Don't ...'. Чтобы решить эту проблему, Вы можете просто написать наклонную черту влево \ перед кавычкой - что означает, что она принадлежит выводу (Вы можете проделать тоже самое с двойными кавычками").



Содержание раздела