Переопределить все события JavaScript, связанные с элементом, одним новым событием - PullRequest
24 голосов
/ 11 января 2011

Предполагая, что на сайте имеется большое количество элементов, с которыми связано неизвестное число и тип событий.

Если мне нужно переопределить все эти события одним связанным событием, итолько это событие сработает, какие рекомендации?

Я бы связал событие с обработчиком события щелчка, и я использую jQuery.

Заранее спасибо.

Ответы [ 4 ]

50 голосов
/ 11 января 2011

Вы ищете 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;
  });
6 голосов
/ 31 декабря 2013

Я хотел бы представить мысль, не удаляя все события вместе (просто переопределить их).

Если ваше новое одно связанное событие (мы называем его «щелчком» здесь) относится к элементу, к которому оно привязано, то я считаю, что вы можете игнорировать любые другие события просто с помощью функции stopPropagation (). Как это

$("specific-selector").on("click", ".specific-class", function (e) {
  e.stopPropagation()
  // e.stopImmediatePropagation()
  /* your code continues ... */
});

Это остановит всплывающие события, поэтому другие события не будут срабатывать. используйте stopImmediatePropagation () для предотвращения других событий, прикрепленных к тем же элементам, что и «щелчок».

Например, если событие "mouseleave" также привязано к элементу $ ("specific-selector .specific-class"), оно также не сработает.

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

Нерешенный вопрос: а что если другие события также используют stopPropagation ()? ... Тогда я думаю, что победит тот, у кого лучшая спецификация, поэтому постарайтесь избегать сложных, слишком много событий - последнее предложение.

Для получения дополнительной информации см. «Прямые и делегированные события» на сайте jQuery .

1 голос
/ 11 января 2011

Похоже, это довольно просто:

$('#foo').unbind('click');
$('#foo').bind('click', myNewFunction);

Спасибо за ваши ответы.

1 голос
/ 11 января 2011

Попробуйте использовать 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 */ };

Это не дает абсолютно никаких затрат на любые изменения, привязку и т. Д.

...