jQuery — обработка событий с использованием Namespaced Events

Часто события навешиваются на элементы так:

$('.class').bind('click', function(){});

1	$('.class').bind('click', function(){});

А когда нужно снять обработчик события с элемента, то делается это так:

$('.class').unbind('click');

1	$('.class').unbind('click');

При этом слетят все обработчики события click с элемента. Можно снимать только конкретный обработчик, но это не очень удобно.
Гораздо удобнее группировать обработчики в неймспэйсы по функциональности, а потом снимать обработчики всего неймспэйса:

$('.class').bind('click.namespace', function(){}); 
$('.class').bind('click.namespace', function(){}); 
$('.class').trigger('click.namespace');
$('.class').unbind('click.namespace');

$('.class').bind('click.namespace', function(){});

$('.class').trigger('click.namespace');

$('.class').unbind('click.namespace');

При этом есть ещё один очень большой плюс: события разных неймспэйсов не вызывают обработчики друг друга, а click вызовет все обработчики

$('.class').bind('click.namespace', function(){}); 
$('.class').trigger('click.namespace'); // Вызовет наш обработчик
$('.class').trigger('click');           // Тоже вызовет
$('.class').trigger('click.other');     // Не вызовет

$('.class').bind('click.namespace', function(){});

$('.class').trigger('click.namespace'); // Вызовет наш обработчик

$('.class').trigger('click'); // Тоже вызовет

$('.class').trigger('click.other'); // Не вызовет

Ссылка на документацию

jQuery — обработка событий с использованием Namespaced Events

Similar Posts

LEAVE A COMMENT Отменить ответ