Включение / выключение сенсорного перемещения документа путем добавления / удаления EventListener

Question

У меня есть запрос на реализацию функции блокировки / разблокировки для прокрутки тела на мобильном телефоне следующим образом:

var myObj = {
 disableBodyScroll: function() {
    document.querySelector('body').addEventListener("touchmove", function(e) {
      e.preventDefault();
      return false;
    }, 
    {passive: false}
    ); 
  },
  enableBodyScroll: function() {
    document.querySelector('body').removeEventListener("touchmove", function(e) {
      e.preventDefault();
      return false;
    }, 
    {passive: false}
    ); 
  }
}

когда я делаю myObj.disableBodyScroll(), все работает нормально. но myObj.enableBodyScroll() это не так, и мой свиток остается заблокированным ...

Любая возможная причина для этого?

ref: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/removeEventListener

Answer 1

Я думаю, это потому, что вы не передаете одну и ту же функцию слушателя. Ваши функции включения и отключения создают как новую функцию eventListener. Так что removeEventListener не может найти ссылку на eventListener

Попробуйте это:

var myObj = {
        handleTouchMove: function (e) {
            e.preventDefault();
            return false;
        },
        disableBodyScroll: function() {
            document.querySelector('body').addEventListener("touchmove", myObj.handleTouchMove, {passive: false}
            );
        },
        enableBodyScroll: function() {
            document.querySelector('body').removeEventListener("touchmove", myObj.handleTouchMove, {passive: false}
            );
        }
    }