Предполагая, что на сайте есть большое количество элементов, у которых есть неизвестное число и тип связанных с ними событий.
Если мне нужно переопределить все эти события одним единственным связанным событием, и только это событие будет срабатывать, каковы некоторые рекомендации?
Я бы привязал событие к обработчику событий click, и я использую jQuery.
Спасибо заранее.
Вы ищете jQuery#unbind.
Чтобы удалить все обработчики событий для элемента или набора элементов, просто выполните:
$('.some-selector').unbind();
Чтобы отвязать только обработчики кликов, используйте unbind('click'):
$('.some-selector').unbind('click');
Чтобы отвязать все обработчики кликов и сразу же привязать свой собственный обработчик, вы можете сделать что-то вроде этого:
$('.some-selector').unbind('click').click(function(event) {
// Your code goes here
});
Обратите внимание, что это будет работать только для событий, связанных с использованием jQuery (используя .bind или любой метод jQuery, который использует .bind внутренне). Если вы хотите удалить все возможные события onclick из заданного набора элементов, вы можете использовать:
$('.some-selector')
.unbind('click') // takes care of jQuery-bound click events
.attr('onclick', '') // clears `onclick` attributes in the HTML
.each(function() { // reset `onclick` event handlers
this.onclick = null;
});
Я хотел бы представить мысль, не удаляя все события вместе (просто переопределяя их).
Если ваше новое одно связанное событие (мы называем это "click" здесь) специфично для связанного с ним элемента, тогда я считаю, что вы можете игнорировать любые другие события просто функцией stopPropagation(). Как этот
$("specific-selector").on("click", ".specific-class", function (e) {
e.stopPropagation()
// e.stopImmediatePropagation()
/* your code continues ... */
});
Это остановит события в пузырьках, поэтому ваши другие события не будут срабатывать. используйте stopImmediatePropagation(), чтобы предотвратить присоединение других событий к тем же элементам, что и "click".
Например, если событие "mouseleave" также привязывается к элементу $( "специфический селектор. специфический класс" ), он также не срабатывает.
Наконец, все остальные события не будут срабатывать над этим элементом, кроме вашего нового элемента "click".
Неразрешенный вопрос: что, если другие события также используют stopPropagation()?... Тогда я думаю, что выигрывает одна из лучших, поэтому старайтесь избегать сложных, слишком много событий - это окончательное предложение.
Вы можете увидеть "Прямые и делегированные события" на сайте jQuery для получения дополнительной информации.
Попробуйте использовать live вместо bind. Затем вы можете легко удалить привязку в реальном времени с помощью die от селектора, который работает быстро, и установить еще один живой так же быстро.
$('selection here').live('..', .....); // multiple invocations
$('selection here').die();
$('selection here').live('click',.....);
DOM не затрагивается вообще. Состояние события оценивается при возникновении события.
Но обычно, если вы просто хотите переключить функции обработчика, почему бы не сделать это следующим образом:
var ahandler = function(evt) { /* first implementation */ }
$('.selector').bind('click', function(evt) { ahandler(evt); });
//and then if you want to change handlers
ahandler = function(evt) { /* new implementation */ };
Это абсолютно не требует никаких изменений, перепроверки и т.д.
Похоже, это довольно просто:
$('#foo').unbind('click');
$('#foo').bind('click', myNewFunction);
Спасибо за ваши отзывы.