Чтение онлайн

на главную - закладки

Жанры

Введение в JavaScript для Мага
Шрифт:

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

<html>

<head>

<script language="JavaScript">

<!- hide

function statbar(txt) {

window.status = txt;

}

// — >

</script>

</head>

<body>

<form>

<input type="button" name="look" value="Писать!"

onClick="statbar('Привет! Это окно состо\яни\я!);">

<input type="button" name="erase" value="Стереть!"

onClick="statbar;">

</form>

</body>

</html>

Итак, мы создаем форму с двумя кнопками. Обе эти кнопки вызывают функцию statbar. Вызов от клавиши Писать! выглядит следующим образом:

statbar('Привет! Это окно состо\яни\я!);

В скобках мы написали строку: 'Привет! Это окно состо\яни\я! . Это как раз и будет текст, передаваемый функции statbar. В свою очередь, можно видеть, что функция statbar определена следующим образом:

function statbar(txt) {

window.status = txt;

}

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

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

Строка txt заносится в строку состояния посредством команды window.status = txt.

Соответственно, удаление текста из строки состояния выполняется как запись в window.status пустой строки.

Механизм вывода текста в строку состояния удобно использовать при работе со ссылками. Вместо того, чтобы выводить на экран URL данной ссылки, Вы можете просто на словах объяснять, о чем будет говориться на следующей странице. Так link демонстрирует это — достаточно лишь поместить указатель вашей мыши над этой ссылкой: Исходный код этого примера выглядит следующим образом:

<a href="dontclck.htm"

onMouseOver="window.status='Don\'t click me!; return true;"

onMouseOut="window.status=;">link</a>

Здесь мы пользуемся процедурами onMouseOver и onMouseOut, чтобы отслеживать моменты, когда указатель мыши проходит над данной ссылкой.

Вы можете спросить, а почему в onMouseOver мы обязаны возвращать результат true. На самом деле это означает, что браузер не должен вслед за этим выполнять свой собственный код обработки события MouseOver. Как правило, в строке состояния браузер показывает URL соответствующей ссылки. Если же мы не возвратим значение true, то сразу же после того, как наш код был выполнен, браузер перепишет строку состояния на свой лад — то есть наш текст будет тут же затерт и читатель не сможет его увидеть. В общем случае, мы всегда можем отменить дальнейшую обработку события браузером, возвращая true в своей собственной процедуре обработки события.

В JavaScript 1.0 процедура onMouseOut еще не была представлена. И если Вы пользуетесь Netscape Navigator 2.x, то возможно на различных платформах Вы можете получить различные результаты. Например, на платформах Unix текст исчезает даже несмостря на то, что браузер не знает о существовании процедуры onMouseOut. В Windows текст не исчезает. И если Вы хотите, чтобы ваш скрипт был совместим с Netscape 2.x для Windows, то можете, к примеру, написать функцию, которая записывает текст в окно состояния, а потом стирает его через некоторый промежуток времени. Программируется это с помощью таймера timeout. Подробнее работу с таймерами мы рассмотрим в одном из следующих параграфов.

В этом скрипте Вы можете видеть еще одну вещь — в некоторых случаях Вам понадобится печатать символы кавычек. Например, мы хотим напечатать текст Don't click me — однако поскольку мы передаем эту строку в процедуру обработки события onMouseOver, то мы используем для этого одинарные кавычки. Между тем, как слово Don't тоже содержит символ одинарной кавычки! И в результате если Вы просто впишете 'Don't… , браузер запутается в этих символах. Чтобы разрешить эту проблему, Вам достаточно лишь поставить обратный слэш \ перед символом кавычки — это означает, что данный символ предназначен именно для печати. (То же самое Вы можете делать и с двойными кавычками — ").

Таймеры

С помощью функции Timeout (или таймера) Вы можете запрограммировать компьютер на выполнение некоторых команд по истечении некоторого времени. В следующем скрипте демострируется кнопка, которая открывает выпадающее окно не сразу, а по истечении 3 секунд.

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

<script language="JavaScript">

<!- hide

function timer {

setTimeout("alert('Врем\я истекло!)", 3000);

}

// — >

</script>

<form>

<input type="button" value="Timer" onClick="timer">

</form>

Здесь setTimeout — это метод объекта window. Он устанавливает интервал времени — я полагаю, Вы догадываетесь, как это происходит. Первый аргумент при вызове — это код JavaScript, который следует выполнить по истечении указанного времени. В нашем случае это вызов — "alert('Врем\я истекло!)". Обратите пожалуйста внимание, что код на JavaScript должен быть заключен в кавычки.

Во втором аргументе компьютеру сообщается, когда этот код следует выполнять. При этом время Вы должны указывать в миллисекундах (3000 миллисекунд = 3 секунда).

Прокрутка

Теперь, когда Вы знаете, как делать записи в строке состояния и как работать с таймерами, мы можем перейти к управлению прокруткой. Вы уже могли видеть, как текст перемещается строке состояния. В Интернет этим приемом пользуются повсеместно. Теперь же мы рассмотрим, как можно запрограммировать прокрутку в основной линейке. Рассмотрим также и всевозможные усовершенствования этой линейки.

Создать бегущую строку довольно просто. Для начала давайте задумаемся, как вообще можно создать в строке состояния перемещающийся текст — бегущую строку. Очевидно, сперва мы должны записать в строку состояния некий текст. Затем по истечении короткого интервала времени мы должны записать туда тот же самый текст, но при этом немного переместив его влево. Если мы это сделаем несколько раз, то у пользователя создастся впечатление, что он имеет дело с бегущей строкой.

Поделиться:
Популярные книги

Аристократ из прошлого тысячелетия

Еслер Андрей
3. Соприкосновение миров
Фантастика:
фэнтези
попаданцы
аниме
5.00
рейтинг книги
Аристократ из прошлого тысячелетия

Миллионщик

Шимохин Дмитрий
3. Подкидыш
Фантастика:
попаданцы
альтернативная история
5.00
рейтинг книги
Миллионщик

Инженер Петра Великого 4

Гросов Виктор
4. Инженер Петра Великого
Фантастика:
попаданцы
альтернативная история
5.00
рейтинг книги
Инженер Петра Великого 4

Легионы во Тьме 2

Владимиров Денис
10. Глэрд
Фантастика:
боевая фантастика
фэнтези
попаданцы
5.00
рейтинг книги
Легионы во Тьме 2

Большая Гонка

Кораблев Родион
16. Другая сторона
Фантастика:
боевая фантастика
попаданцы
рпг
5.00
рейтинг книги
Большая Гонка

Лекарь Империи 6

Карелин Сергей Витальевич
6. Лекарь Империи
Фантастика:
городское фэнтези
боевая фантастика
аниме
попаданцы
5.00
рейтинг книги
Лекарь Империи 6

Диверсант

Вайс Александр
2. Фронтир
Фантастика:
боевая фантастика
космическая фантастика
5.00
рейтинг книги
Диверсант

#Бояръ-Аниме. Газлайтер. Том 37

Володин Григорий Григорьевич
37. История Телепата
Фантастика:
фэнтези
аниме
боевая фантастика
5.00
рейтинг книги
#Бояръ-Аниме. Газлайтер. Том 37

Адвокат Империи 6

Карелин Сергей Витальевич
6. Адвокат империи
Фантастика:
городское фэнтези
аниме
дорама
попаданцы
5.00
рейтинг книги
Адвокат Империи 6

Обгоняя время

Иванов Дмитрий
13. Девяностые
Фантастика:
попаданцы
5.00
рейтинг книги
Обгоняя время

Лихие. Авторитет

Вязовский Алексей
3. Бригадир
Фантастика:
альтернативная история
попаданцы
5.00
рейтинг книги
Лихие. Авторитет

Вечный. Книга II

Рокотов Алексей
2. Вечный
Фантастика:
боевая фантастика
попаданцы
рпг
5.00
рейтинг книги
Вечный. Книга II

Гнездо Седого Ворона

Свержин Владимир Игоревич
2. Трактир "Разбитые надежды"
Фантастика:
боевая фантастика
7.50
рейтинг книги
Гнездо Седого Ворона

Эммануэль

Арсан Эммануэль
1. Эммануэль
Любовные романы:
эро литература
7.38
рейтинг книги
Эммануэль