Включение инициируемого события, если событие совпадает с текущим событием - PullRequest
0 голосов
/ 27 мая 2010

У меня есть кнопка, которая запускает / останавливает таймер. Когда я щелкаю по нему, я удаляю текущий обработчик события и присоединяю противоположный. То есть, нажмите «Стоп», и функция «Старт» будет добавлена ​​для следующего клика.

Однако в IE (7) не уверен насчет 8. Вновь присоединенное событие также запускается после завершения исходной функции:

Линия жизни в IE7:
Нажатие кнопки -> начинается функция «Стоп» -> функция «Стоп» удалена -> функция «Старт» присоединена -> функция «Стоп» завершается -> вызывается функция «Старт».

Я знаю, что это связано с битом присоединения события, потому что, если я удаляю его, событие Start не срабатывает.

Это кажется немного странным, поскольку у меня такая же ситуация в функции «Пуск», то есть «Пуск» удален, «Стоп» вызван. Но, к счастью, это не вызывает бесконечный цикл.

if(btn.attachEvent){
  btn.detachEvent("onclick", stop);
  btn.attachEvent("onclick", start);
}else if(btn.addEventListener){
  btn.removeEventListener("click", stop, true);
  btn.addEventListener("click", start , true);
}

Все отлично работает в FF и Chrome. Я изменил порядок присоединения / отсоединения, просто чтобы увидеть, имеет ли это значение, но это не так.

Добавление Извините, но нет ответов, касающихся jQuery, Protoype et al. Это не то, что я хочу интегрировать для этого проекта.

1 Ответ

2 голосов
/ 27 мая 2010

Возможно, вам следует использовать вместо этого метод переключения: http://jsfiddle.net/QRYsS/

// get a cross-browser function for adding events, place this in [global] or somewhere you can access it
var on = (function(){
    if (window.addEventListener) {
        return function(target, type, listener){
            target.addEventListener(type, listener, false);
        };
    }
    else {
        return function(object, sEvent, fpNotify){
            object.attachEvent("on" + sEvent, fpNotify);
        };
    }
}());

var toggle = (function(){
    var state = false;
    return function(){
        state = !state;
        if (state) {
            alert("foo");
        }else{
            alert("bar");
        }
    };
})();

on(btn, "click", toggle);
...