| | | | |||
|
|||
|
|
|||
Главная  Программирование Java Работа со сценариями — обработчиками событий |
|||
Работа со сценариями — обработчиками событийОглавлениеРабота со сценариями — обработчиками событий Страница 2 Страница 3 Страница 4 Страница 1 из 4 Настала пора поговорить о сценариях-обработчиках событий, принципах их написания и привязки к элементам страницы и событиям. Как создать сценарий — обработчик события? Проблема Мне нужно написать сценарий — обработчик события. Какие существуют способы привязать его к нужному мне элементу страницы и событию? Решение 1 Проще и удобнее всего привязать обработчик прямо к тегу, создающему элемент страницы, событие которого нужно обработать. Вот синтаксис такой привязки: «Тег элемента страницы> <Название события> = "<Код JavaScript обработчика событиям" [Остальные атрибуты тега]> Фактически в этом случае код JavaScript сценария — обработчика события присваивается особому атрибуту тега, создающего элемент страницы. Имя этого атрибута совпадает с названием события, к которому нужно привязать обработчик. Например, событию onclick, наступающему при щелчке мышью на элементе страницы, соответствует атрибут onclick: <INPUT TYPE="button" ID="btnOK"ONCLICK="<Код обработчика события onClick>"> Примеры Обработчик события onclick кнопки (его код JavaScript выделен полужирным шрифтом): <FORM> <INPUT TYPE="button" ID="btnOK" VALUE="Нажми!"ONCLICK="document.all['btnOK'].value = 'Нажато';"> </FORM> Поскольку код обработчика совсем мал (одно-единственное выражение), мы присвоили его атрибуту onclick тега <input>. Этот атрибут, как мы уже знаем, соответствует событию onclick, наступающему при щелчке мышью. Но если код обработчика события достаточно велик, лучше всего оформить его в виде функции, поместить ее объявление в секцию заголовка страницы, а в значение соответствующего событию атрибута поместить вызов этой функции. Давайте рассмотрим пример такой функции — обработчика события: <HEAD> <SCRIPT TYPE="text/javascript"> function btnOKOnClick() { document.all["btnOK"].value = "Нажато"; window.alert("Вы только что нажали кнопку!"); } </SCRIPT> </HFAD> <BODY> <FORM> <INPUT TYPE="button" ID="btnOK" VALUE="Нажми!"ONCLICK="btnOKOnClick();"> </FORM> </BODY> Метод alert объекта window выводит на экран окно-предупреждение с текстом, переданным в качестве единственного параметра этого метода. Решение 2 Использовать особые свойства экземпляра объекта, соответствующего нужному элементу страницы. Эти свойства имеют те же имена, что и соответствующие им события, и должны принимать в качестве значения функции-обработчики этих событий. Общий синтаксис написания этих обработчиков таков: <Тег, создающий элемент страницы, события которого должны быть обработаны"> <SCRIPT TYPE="text/javascript"> <Объявление функции-обработчика> <Элемент страницы>.<Свойство, соответствующее событию> =<Функция-обработчик> </SCRIPT> Обратим внимание — выражение, присваивающее функцию-обработчик соответствующим свойствам элемента страницы, должно помещаться после тега, создающего этот элемент. Что касается свойств, которым нужно присвоить функции-обработчики, то они носят "говорящие" названия, как и описанные выше атрибуты. Так, знакомому нам событию onclick соответствует свойство onclick. Народ предупреждает Имена свойств, соответствующих событиям, должны быть набраны только маленькими (строчными) буквами. Пример <BODY> <FORM> <INPUT TYPE="button" ID="btnOK" VALUE="Нажми!"> </FORM> <SCRIPT TYPE="text/javascript"> function btnOKOnClick() { document.all["btnOK"].value = "Нажато"; } document.all["btnOK"].onclick = btnOKOnClick; </SCRIPT> </BODY> Решение З (для Firefox) Использование функций-слушателей DOM. Самый сложный способ, но, судя по всему, за ним будущее... Пред. - След. » |
Архив статей
СИ-БИ техника
КВ техника УКВ техника Радиоизмерения Защита от TVI Источники питания Софт Расчеты Справочники СИ-БИ техника
|
||
