Каков наилучший способ предотвратить выполнение одной и той же триггерной функции дважды?

Question

Триггер может быть применен на уровне формы и / или на уровне элемента.Как лучше всего выполнить его , а не во второй раз?

<form id='f'>
  <input id='i' type='text' />
</form>

<script>
validate = function(e) { ... }
reformat = function(e) { ... }
document.getElementById('f').addListener('change',validate,true);
document.getElementById('i').addListener('change',validate,true);
document.getElementById('i').addListener('change',reformat,true);
</script>

Контекст: словарь данных говорит, что элемент i должен быть немедленно проверен, и разработчик приложенияговорит, что все элементы в форме должны быть проверены немедленно.

Это одна и та же функция, обычно вызываемая один раз, но иногда дважды.

Каков наилучший способ предотвратить выполнение функции validateдважды?

Примечание: e.stopPropagation() останавливает все дальнейшие вызовы события click, так что триггер reformat больше не вызывается.

Answer 1

Вы можете добавить реквизит в параметре события, чтобы убедиться, что он запускается один раз:

validate = function(e) { if (e.done) return; /* code */ e.done = true; }
document.getElementById('f').addListener('change',validate,true);
document.getElementById('i').addListener('change',validate,true);

DEMO

Хотя я не понимаю, почему вы связываете событие дважды

РЕДАКТИРОВАТЬ: Для кросс-браузерности (читай: IE) измените его на:

validate = function(e) {
    if ((e = e || window.event).done) return;
    /* code */ 
    e.done = true;
}
document.getElementById('f').addListener('change',validate,true);
document.getElementById('i').addListener('change',validate,true);

Отредактировано DEMO

Answer 2

Основная идея (на основе http://www.quirksmode.org/js/events_order.html):

function cancelBubbling(e) {
    if (!e) var e = window.event;

    e.cancelBubble = true;

    if (e.stopPropagation) e.stopPropagation();
}

var validate = function(e) {
    cancelBubbling(e); // important!

    ...
};