СОБЫТИЯ БРАУЗЕРА

.error()
запускается при возникновении ошибки
можно к нему привязать функцию
Пример: создадим дескриптор с несуществующим изображением и выведем уведомление

$("<img/>", {
             "src":"not/an/image.png",
             "alt":"Меня нету"
              })
               .error( function() {
                         console.log("Точчно говорю - нэмае!");
                        })
                        .appendTo("span.foo");

 

.scroll() 

на прокрутку. Срабатывает на шаг колесика

$(window)
            .scroll(function(){
                     console.log("Мы прокручиваемся, ахтунг!")
                      });

ОБРАБОТКА СОБЫТИЙ ЗАГРУЗКИ ДОКУМЕНТА

.ready()

для отработки скрипта после полной загрузки DOM. Может принимать параметр, указывающий псевдоним для функции jQuery - для избежания конфликтов с другими библиотеками Javascript

$(document).ready(function(){
          //Весь код здесь
          });
//во избежание конфликта с другими библиотеками
jQuery(document).ready(function($){
                                                $("p").fadeOut();
                                                  });
//с псевдонимом для функции 
jQuery(document).ready(function(xTest){
                               //Весь код здесь
                               xTest("#bar").click(function(){
                                                   console.log("По мне щелкнули!");
                                                     });
                                     });
//сама функция jQuery может быть использована в качестве псевдонима для метода .ready()
jQuery(function($){
                      $("p").css({
                                    "color":"red",
                                    "background":"yellow"
                                     });
                         });

 

ПОДКЛЮЧЕНИЕ СОБЫТИЙ

Доступны следующие события
blur, focus, focusin, focusout, load, resize, scroll, unload, click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress, keyup, error

.on()
Для связывания обработчика обытий с элементом используются метод .on() (до версии 1.7 - .bind() )
Событие или список событий через пробел - первый элемент, функция обработчика - второй. Можно передавать объект в формате JSON

$("p")
      .on("click", function(){
                 alert("Не мучай мышку - параграфы не предназначны для щелчков");
            });

пример 2 - привязываем два события

$("p")
   .on("click mouseover", function(){
          console.log("Не мучай мышку - параграфы не предназначны для щелчков");
      });

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

//в данном примере для каждого параграфа удет выводиться персональное сообщение
//создаем значение для переменной notice
var notice = "Я живу в переменной!";
$("p.foo")
      .on("click", {n:notice}, function(event){
              alert(event.data.n);
           });
//меняем значение переменной
var notice = "А я - для параграфа с идентификатором #bar.";
$("p#bar")
     .on("click", {n:notice}, function(event){
             alert(event.data.n);
          });

привяжем к разным событиям разные обработчики 

$("p")
.on({
      "click":function(){
                     alert("Меня кликнули!");
               },
      "mouseover":function(){ 
                     console.log("Ой, тут кто-то есть!");
               }
    });

 

.off()
для удаления события вызываем .off() (до версии 1.7 .unbind()) Без параметров удаляет все события, первый параметр - какое событие удаляем, второй - какую функцию для события

$("p").off(); //удаляем все
$("p").off("click"); //удаляем обработчик клика
//пример удаления функции
var func1=function(){
               console.log("Запуск события");
                    },
     func2=function(){
               console.log("Это второй обработчик");
          };
$("#bar")
     .on("click", func1)
     .on("click", func2)
     .trigger("click")//однократный запуск события
     .off("click", func2);

.live() и .die() использовались как альтернатива .bind() и .unbind() для диинамически созданных элементов, сейчас эту функцию выполняет .on(), но привязывать его нужно к заведомо сущесствующему всегда на странице элементу, и с помощью указания селектора в аргументе работать с динамиически создаваемыми элементами

var func1 = function(){
      alert("Сейчас будет произведен переход по ссылке");
            };
$("<a>",{
             "href":"http://google.com",
             "text":"Гугля"
              })
                 .appendTo("#bar");
$('body')
         .on('click',"a", func1);

 

.one()
.one() выполняет ту же функцию, что и .on(), но событие происходит только один раз

$("#bar").one("click", function(){
               alert("Это сообщение выведется только один раз - можете дальше не напрягаться.");
                  });

 

.toggle()
.toggle() позволял связать с событием click несколько функций - эта функция удалена в jQuery 1.9

$("#bar")
      .toggle(function(){
                     console.log("Один");
                  },
                  function(){
                     console.log("Два");
                  },
                  function(){
                     console.log("Три");
           });

сейчас .toggle() служит для переключения вдимости объекта. Без параметров - моментально, с параметрами - с анимацией. Последовательный запуск будет скрывать/показывать абзац.

$("#bar").toggle();//без анимации
$("#bar").toggle(400);//с анимацией

 

передача булева элемента указывает что именно точно нужно сделать - скрыть или показать элемент

$("#bar").toggle(true);//отобразить все элементы
$("#bar").toggle(false);//скрыть все элементы

 

.trigger()
служит для непосредственного запуска событиия

$("#bar")
        .on("click", function(){
                 alert("А я запускаюсь автоматом!");
              })
               .trigger("click"); 

можно передавать дополнительные данные через параметры. В примере при запуске выведется note, а при последующих кликах - msg

var note = "Запуск события!";
$("#bar")
         .on("click", function(event,msg) {  //разрешен второй аргумент
                  //если переменная "msg" не передается, выводится сообщение, заданное по умолчанию
                  var log = msg || "Щелчок!";
                  alert(log);
                             })
                               .trigger("click", [note]);//передаваемый массив указан в квадратных скобках

 

Прямые методы для работы с событиями (shortcut)
принимают функцию обработика в качестве аргумента. Если такой метод вызывается без аргумента - он вызывает метод .trigger() для своего типа события.
К ним относятся: .blur(), .focus(), .focusin(), .focusout(), .load(), .resize(), .scroll(), .unload(), .click(), .dblclick(), .mousedown(), .mouseup(), .mousemove(), .mouseover(), .mouseout(), .mouseenter(), .mouseleave(), .change(), .select(), .submit(), .keydown(), .keypress(), .keyup(), .error()
пример кода

$("#bar").click(function(){alert("Клик!"); });//простой пример
$("#bar").click(function(){alert("Клик!"); }).click();//пример с триггером