Javascript removeEventListener не работает

У меня есть следующий код для добавления eventListener

 area.addEventListener('click',function(event) {
              app.addSpot(event.clientX,event.clientY);
              app.addFlag = 1;
          },true);

Он работает правильно, как и ожидалось. В другой функции я попытался удалить прослушиватель событий, используя следующий код

 area.removeEventListener('click',function(event) {
              app.addSpot(event.clientX,event.clientY);
              app.addFlag = 1;
          },true);

Но даже прослушиватель не удаляется. Почему это происходит? Есть ли какие-либо проблемы с моим removeEventListener()? Примечание. Здесь область похожа на document.getElementById('myId')

Ответ 1

Это потому, что две анонимные функции - это совершенно разные функции. Ваш аргумент removeEventListener не относится к объекту функции, который ранее был прикреплен.

function foo(event) {
              app.addSpot(event.clientX,event.clientY);
              app.addFlag = 1;
          }
 area.addEventListener('click',foo,true);
 area.removeEventListener('click',foo,true);

Ответ 2

В обоих вызовах создается две разные функции. Таким образом, вторая функция никак не связана с первой, и двигатель способен удалить эту функцию. Вместо этого используйте общий идентификатор для функции.

var handler = function(event) {
              app.addSpot(event.clientX,event.clientY);
              app.addFlag = 1;
          };
area.addEventListener('click', handler,true);

позже вы можете удалить обработчик, вызвав

area.removeEventListener('click', handler,true);

Ответ 3

Чтобы удалить его, сохраните функцию в переменной или просто используйте именованную функцию и передайте эту функцию вызову removeEventListener:

function areaClicked(event) {
    app.addSpot(event.clientX, event.clientY);
    app.addFlag = 1;
}

area.addEventListener('click', areaClicked, true);
// ...
area.removeEventListener('click', areaClicked, true);

Ответ 4

сначала определите обработчик событий,

а затем

area.addEventListener('click',handler);
area.removeEventListener('click',handler);

Ответ 5

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

function yourFunction () {
    var app;

    function waitListen () {
        waitExecute(app, waitListen);
    }

    area.addEventListener('click', waitListen, true);
}

Затем у вас есть то, что вам нужно удалить, когда вызывается waitExecute.

function waitExecute (app, waitListen) {
    ... // other code
    area.removeEventListener('click', waitListen, true);
}