Программирование на JavaScript

Лабораторная работа №1 Лабораторная работа №2 Лабораторная работа №3 Лабораторная работа №4 Лабораторная работа №5

Лабораторная работа №4

Команда onClick (на щелчок)

onMouseOver запускает событие, если навести курсор на ссылку. Следовательно, щелкнув по ссылке, можно с таким же успехом запустить событие через onClick.

Чтобы продемонстрировать действие команды, воспользуемся методом alert. Если вы сделали задание к прошлому уроку, то знаете, что это такое. Вот еще раз его схема: alert('текст, который появится в окне')

Таким образом, получаем:


1	`<a href="http://www.jsp.newmail.ru"` `onClick="alert('Уже уходите!');">Жмите сюда</a>`

                <a href="http://www.jsp.newmail.ru" onClick="alert('Уже уходите!');">Жмите сюда</a>

И вот что это нам дает (когда вы нажмете на ссылку, она сработает):

Жмите сюда

Помните, что внутри одинарных кавычек нельзя употреблять слова с апострофами ', иначе браузер поймет их, как окончание текста, а это не входит в ваши намерения. Ошибка.

Команда onFocus (на фокус)

Это замечательная команда, которая вызывает действие, когда пользователь «фокусируется» на элементе страницы. Это годится для форм: флажков (checkbox) и текстовых полей (textbox).

Вот пример:


1 2 3	`<form>` `<input` `type="text"` `size="30"` `onFocus="window.status='Текст в строке состояния';">` `</form>`

                <form>
                    <input type="text" size="30" onFocus="window.status='Текст в строке состояния';">
                </form>

Вот что вы получаете (щелкните в поле ввода и посмотрите на строку состояния):

Команда onBlur (на потерю фокуса)

Если можно сосредоточиться на объекте, значит, можно и «потерять фокус». оnBlur позволяет сообщить пользователю о том, что он изменил свой ответ. Этот обработчик не так часто используется, но вот вам пример. Внизу строка для ввода текста, в которой уже что-то написано. Измените текст и уведите курсор, как если бы вы перешли к следующему предмету в списке.


1 2 3	`<form>` `<input` `type="text"` `size="45"` `value="Впишите свое имя и щелкните по другой строке"` `onBlur="alert('Вы изменили ответ — уверены, что он правильный?');">` `</form>`

                <form>
                    <input type="text" size="45" value="Впишите свое имя и щелкните по другой строке" onBlur="alert('Вы изменили ответ — уверены, что он правильный?');">
                </form>

Команда onChange (на изменение)

Действие этой команды очень похоже на действие предыдущей, onBlur. Ее главная задача — проверка. Этот обработчик события проверяет, сделал ли пользователь то, что вы от него просили. Пример очень похож на предыдущий, но действует все-таки по-другому.


1 2 3	`<form>` `<input` `TYPE="text"` `size="45"` `value="Измените текст и щелкните по другой строке"` `onChange="window.status='Текст был изменен';">` `</form>`

<form>
    <input TYPE="text" size="45" value="Измените текст и щелкните по другой строке" onChange="window.status='Текст был изменен';">
</form>

Это дает вам следующее...

Команда onSelect (на выделение)

Эта команда работает так же, как и три предыдущие, отмечая, что в поле ввода произошли изменения, — в данном случае был выделен текст.

Команды onLoad и onUnload (на вход и выход)

Обе команды помещаются внутри строки HTML <BODY>. Они вызывают событие, когда страница открывается или закрывается, то есть когда вы уходите со страницы. Эти команды потребуются вам, когда мы возьмемся за функции.