Для связывания обработчика событий с элементом используется метод  .bind(). Этот метод принимает событие в качестве своего первого аргумента и функцию обработчика — в качестве второго.

 
В качестве первого аргумента можно указать список событий, разделенных пробелами, что позволяет связать с элементом сразу несколько событий. Кроме того, для связывания различных событий с различными обработчиками методу .bind() можно передавать объект в формате JSON. Свяжите вывод сообщения в консоли с событием click, используя следующий код.

$("p")
    .bind("click", function(){
        console.log("Выполнен щелчок!");
    });

Щелчок на любом абзаце после выполнения этого кода приведет к выводу сообщения в окне консоли. Чтобы связать обработчик как с событием click, так и с событием mouseover, выполните следующий код.

$("p")
    .bind("click mouseover", function(){
            console.log("Произошло событие!");
        });

Теперь и щелчок на абзаце, и наведение на него указателя мыши вызовут появление сообщения о событии в окне консоли.

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

 
Установите обработчик щелчка для двух абзацев тестового документа так, чтобы при выполнении щелчков на них выводились разные сообщения, воспользовавшись для этого следующим кодом.

// Создать значение для переменной notice
var notice = "Я живу  в переменной!";
$("p.foo").bind("click", { n:notice }, function(event){
        console.log(event.data.n);
    });
 
// Изменить значение переменной "notice"
var notice = "Я также живу в переменной!";
$("#bar").bind("click", { n:notice }, function(event){
        console.log(event.data.n);
    });

   
Чтобы привязать к событиям click и mouseover разные обработчики, используйте следующий код.

$("p")
    .bind({
            "click":function(){
                    console.log("Щелчок!");
                },

            "mouseover":function(){
                    console.log("Наведение курсора мыши!");
                }
        });

 
После выполнения этого кода в консоли будут выводиться разные сообщения для разных событий при их наступлении.

 
Для удаления любого события достаточно вызвать метод  .unbind(). Будучи вызванным без параметров, он удаляет из элемента все события. Чтобы уточнить, какое именно событие подлежит удалению, можно указать его имя в качестве первого параметра. Чтобы дополнительно уточнить, какую именно функцию следует удалить из события, можно указать ее имя в качестве второго параметра.

 
Чтобы отключить все события от абзацев в нашем примере, используйте следующий код:
$("p").unbind();

 
Для удаления лишь обработчика щелчка используйте следующий код:
$("p").unbind("click");

 
Если же с элементом была связана какая-либо специальная функция, ее можно удалить следующим образом.var func1 = function(){
            console.log("Запуск события!");
        },
    func2 = function(){
            console.log("Другой обработчик!");
        };
$("#bar")
    .bind("click", func1)
    .bind("click", func2)
    .trigger("click") // запуск только одного события
    .unbind("click", func1);

  
Приведенный выше код создает две функции (сохраняемые в двух переменных  func1 и func2) связывает их с событием click для абзаца с идентификатором bar, однократно запускает событие (о функции .trigger() говорится далее) и отключает функцию, хранящуюся в переменной fund.

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