微信网页弹窗滑动事件传穿透解决方案

尝试1.监听touchmove事件，在回调中阻止事件冒泡   会阻止原生滚动；

document.querySelector('#example').addEventListener(function (e) {
    event.preventDefault()
})

尝试2: 监听touchmove事件判断正在进行的操作为上划或者下拉以及是否到顶到底，利用css属性  touch-action: none 阻止滑动   添加了此属性的元素压根不响应touch事件导致无法进行后续逻辑

 

解决方案

在弹窗出现时给body设置overflow：hidden，关闭时设为时 auto 即可，简单粗暴还有用；