Знаете ли Вы, что когда добавляется событие по нажатию мыши к элементу, например, так:
$('#el').click(function () { /*******/ });
Вы в действительности используете оболочку для метода bind()? Чтобы использовать метод bind(), Вам нужно передать тип события в качестве первого параметра и функцию в качестве второго параметра.
Если Вы используете много событий, то можете категоризировать их с помощью именования; просто добавьте точку после имени события и используйте именование.
$('#el').bind('click', function () { /*******/ });
$('#el').bind('click.toolbarEvents', function () { /*******/ }); // именование
Вы также можете назначать одну и туже функцию нескольким событиям в одно и тоже время, разделяя их пробелами. Так, чтобы получить эффект всплытия, Вы можете начать следующим образом:
$('#el').bind('mouseover mouseout', function () { /*******/ });
Вы можете передать данные функции, добавляя третий параметр (на второй позиции):
$('#el').bind('click', { status : 'user-ready' }, function () {
switch(event.data.status) {
/********/
}
});
Рано или поздно Вы столкнетесь с ситуацией, когда при вставке элемента в DOM с помощью обработчика событий, обработчик событий, который сделан с помощью bind (или его оболочки), не работает для вставленного элемента. В этом случае Вам нужно использовать метод live() (делегировать). Таким образом добавляется обработчик события добавляется соответствующему вставленному элементу.
$('.toggle').live(function () {
/* Какой-то код */
$('Делаем свойства доступными').appendTo($('#optionsPanel'));
/* Какой-то код */
});
Для удаления обработчика событий, созданных методом bind(), используйте метод unbind(). Если ему не передаются никакие параметры, то он удаляет все обработчики. Вы можете передать ему тип события, и он удалить обработчики событий только указанного типа. Чтобы удалить события из нужного пространства имен, добавьте это пространство имен. Если Вы хотите удалить определенную функцию, передайте ее имя как второй параметр.
$('button').unbind(); // Удаляет все
$('button').unbind('click'); // Удаляет все обработчики события click
$('button').unbind('.toolbarEvents'); // Удаляет все события из пространства имен toolbarEvents
$('button').unbind('click.toolbarEvents'); // Удаляет все события click из пространства имен toolbarEvents
$('button').unbind('click', myFunction); // Удаляет одну функцию
Вы можете использовать методы bind/unbind анонимно. В этом случае методы будут работать только с именем функции.
Если Вам надо отвязать событие из функции, которая вызвана самим событием, просто передайте методу unbind() объект event.
$('p').bind('click', function (event) {
$('p').unbind(event);
} );
Вы не можете использовать unbind() для события live. Используйте метод die(). Без параметров он удалит все события live из коллекции элемента. Вы можете также передавать ему тип события или тип и функцию.
$('span').die(); // Удаляет все
$('span').die('mouseover'); // Удаляет все для события mouseovers
$('span').die('mouseover', fn); // Удаляет только один обработчик