Выполнение строки в условном и по умолчанию при запуске

Question

У меня есть эта скрипку: http://jsfiddle.net/zhaem/Lyzrtefo/7/

var orangeMode = true 
var isTracking = true 

getMouseXY = function(e) { 
    if (isTracking) { 
    var tempX = e.pageX 
    var tempY = e.pageY 

    if (tempX < 0){tempX = 0} 
    if (tempY < 0){tempY = 0} 

    document.getElementById("circle1").style.top = (tempY - 25) + "px"; 
    document.getElementById("circle1").style.left = (tempX - 25) + "px"; 
    } 
    return true 
} 

document.onmousemove = getMouseXY; 

var toggleTrackCircle = function() { 
    isTracking = !isTracking; 
    console.log(isTracking); 
} 

document.getElementById("circle1").addEventListener("click", toggleTrackCircle); 

flip = function() { 
    orangeMode = !orangeMode; 
    if (orangeMode) { 
    document.getElementById("circle1").style.backgroundColor = "orange"; 
    document.getElementById("circle1").addEventListener('mouseover', function() {isTracking = true;}) 
    // When the above line is executed the circle will stick to your cursor on HOVER after clicking and setting it down. 
    } else { 
    document.getElementById("circle1").style.backgroundColor = "blue"; 
    } 
} 
document.getElementById("box3").addEventListener("click", flip); 

Там есть это одна линия, что когда присутствует изменит поведение взаимодействия. (Вы всегда можете щелкнуть, чтобы остановить курсор от отслеживания, но когда эта строка будет там, кружок будет снова прикрепляться к нему при наведении курсора, а когда это не так, он будет только нажимать + нажимать.

document.getElementById("circle1").addEventListener('mouseover', function() {isTracking = true;}) 

Я пытаюсь обернуть его в некоторую условную логику в функции флип (которую вы можете контролировать, нажав красную рамку в углу), чтобы orangeMode == он пал на зависании, а не orangeMode, он только повторно нажимает на клик

Функция флип отлично работает для изменения цвета, но этот прослушиватель событий не работает, как хотелось бы. (После того, как вы пройдете через него, он работает, но для любого состояния, и он не запускается оранжевой разгрузкой.

Любая помощь будет высоко оценена.

Answer 1

Вам нужно поставить 'isTracking = true;' внутри именованной функции, поэтому вы можете использовать «removeEventListener», чтобы отключить функцию. Это означает, что вы добавить эту функцию:

var trackCircle = function() { 
    isTracking = true; 
} 

Затем вы ссылаетесь, что по щелчку вместо анонимной функции:

circle.addEventListener('mouseover', trackCircle) 

Тогда вы просто удалить это событие в своем другом:

circle.removeEventListener('mouseover', trackCircle) 

О, и я бы добавил это наверху, поэтому вам не нужно повторять фразу getElementById:

circle = document.getElementById("circle1"); 

Надеюсь, что помогает. Да, и вот редактировать на свою скрипку:

http://jsfiddle.net/Lyzrtefo/9/