PHP SQL
PHP SQL .ru
  Главная  Уроки  PHP  MySQL  jQuery  RegEx  CSS  Книги  Форум  
 Функции


  На главную

  Назад  Вперед

  Печать

События документа

При взаимодействии пользователя с веб-страницей происходят события. События — это своего рода извещения системы о том, что пользователь выполнил какое-либо действие или внутри самой системы возникло некоторое условие. События возникают в результате щелчка на элементе, перемещения мыши, нажатия клавиши клавиатуры, изме-нения размеров окна, окончания загрузки веб-страницы и т.д. Зная, какие события может генерировать тот или иной элемент веб-страницы, можно написать функцию для обработки этого события. Например, при отправке данных формы возникает событие onsubmit. При наступлении этого события можно проверить данные, введенные пользователем, и, если они не соответствуют ожидаемым, прервать отправку данных.

В самом начале книги мы уже рассматривали возможность выполнения скриптов сра-зу после формирования структуры документа, не дожидаясь загрузки других элементов. Как вы уже знаете, обработать это событие можно с помощью метода ready () .
$(document).ready(function() {
alert("Документ доступен для выполнения скриптов");
});

Если необходимо выполнить какие-либо действия только после полной загрузки са-мого HTML-документа, а также всех других элементов (например, изображений), то можно воспользоваться методом load (). Синтаксис метода таков.
load{Функция обратного вызова)
В параметре Функция обратного вызова указывается ссылка на функцию следующего формата.
function <Название функции>{[Объект event]) {
// ...
}

Выведем подтверждающее сообщение и тип события после полной загрузки веб-страницы.
$(window).load(function(е) {
alert("Документ полностью загружен");
alert("Тип события " + е.type);
});
В результате выполнения получим два сообщения.
Документ полностью загружен
Тип события load

Для выполнения каких-либо действий непосредственно перед выгрузкой документа предназначен метод unload (). Метод имеет следующий синтаксис.
unload(Функция обратного вызова)

В параметре Функция обратного вызова указывается ссылка на функцию следующего формата.
function <Название функции>([<Объект event>]) {
// ...
}
Выведем сообщение перед выгрузкой документа.
$(window).unload(function()
{ alert("Заходите еще!");
});
В этом разделе рассмотрим еще два полезных метода.

resize (Функция обратного вызова) — выполняется при изменении раз-мера окна.

scroll (Функция обратного вызова) — выполняется при прокручивании содержимого элемента страницы, документа, окна или фрейма.

В параметре Функция обратного вызова указывается ссылка на функцию следующего формата.
function Название функции([Объект event]) {
// ...
}

Обработать прокрутку содержимого окна и вывести сообщение можно так.
$(window).scroll(function() {
alert("Прокрутка содержимого окна");
});

В качестве примера использования метода resize () получим ширину и высоту окна после изменения его размера (листинг 6.1).
Листинг 6.1. Вывод ширины и высоты окна при изменении размера

<html>
<head>
<title>Вывод ширины и высоты окна при изменении
размера</title>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8">
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
$(document).ready(function() {
   $(window).resize(function() {
      var elem = $(window);
      $("#div1").html("Ширина: " + elem.width() + "<br>")
         .append("Высота: " + elem.height());
   });
});
//-->
</script>
</head>
<body><div id="div1"></div>

</body>
</html>

При изменении размера окна в элементе с идентификатором divl будет выведена ширина и высота окна.

Метод error (Функция обратного вызова) вызывается при наличии ошибки на странице или в коде JavaScript. В параметре Функция обратного вызова указы-вается ссылка на функцию следующего формата.
function Название функции([Сообщение[, URL[, Номер строки]]]){
// ...
}

Если ошибка произошла в объекте window, то в функции обратного вызова будут доступны три параметра:
Сообщение — текст, описывающий ошибку;
URL — полный URL-адрес документа с ошибкой;
Номер строки — номер строку с ошибкой.

Чтобы скрыть ошибки JavaScript от пользователей, необходимо внутри функции обратного вызова вернуть значение true.
$(window).error(function(){
return true;
});

С помощью метода error () можно обработать ошибку загрузки изображения.
$("img").error(function() {
$(this).attr("src", "noimage.gif");
});
Обратите внимание
Для корректной работы этого примера необходимо разместить скрипт на сервере. В противном случае обработки события не будет.

 
Предыдущая   На главную   Следующая          

Ваш комментарий:

'

Реклама на сайте | Обмен ссылками | Ссылки | Контакты
Добавить статью | Добавить исходник
2010-2014 © phpsql.ru