js 监听和移除监听事件

最新推荐文章于 2023-09-17 02:26:06 发布

原创最新推荐文章于 2023-09-17 02:26:06 发布 · 1.5w 阅读

7 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

javascript 专栏收录该内容

18 篇文章

订阅专栏

这段代码展示了JavaScript中对元素焦点与失去焦点事件的监听处理，以及页面滚动位置的保存与恢复。当咨询描述框获取焦点时，重置页面滚动位置；失去焦点时，滚动位置恢复到之前的状态，并移除焦点事件监听。同时，还涉及到监听手机返回事件的处理，通过判断状态来决定是否执行页面跳转。

先上代码

const bfscrolltop = document.body.scrollTop; 
document.getElementById('consultDes').addEventListener('focus', this.resetScoll, false)
document.getElementById('consultDes').addEventListener('blur', function() {
   document.body.scrollTop = bfscrolltop
   document.getElementById('consultDes').removeEventListener('focus', this.resetScoll, false)
      clearInterval(timer);
   }, false)
}

说明：
在这里插入图片描述
removeEventListener只能移除具名函数的监听，且方法名称后面不能带（）

// 监听手机返回
window.addEventListener("popstate", goBack(), false);
function goBack () {
  if (this.showSelectlist) {
    this.showSelectlist = false
    window.history.pushState("","","#");
    window.location.href = window.location.origin + '/#/taskAdd'
  }
  console.log(window.location.href)
}

// 取消监听
window.removeEventListener("popstate", this.goBack, false);