微信H5禁止下拉 且可下滚动指定区域

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35

var app = document.getElementsByClassName("tree-hole-room-messages")[0];    var touchstartY;    app.addEventListener(      "touchstart",      function(event) {        console.log(1);        var events = event.touches[0] || event;        touchstartY = events.clientY; //获取触摸目标在视口中的y坐标      },      false    );      app.addEventListener(      "touchmove",      function(event) {        var events = event.touches[0] || event;        //注意app.scrollTop始终为0        var scrollTop = app.scrollTop || document.documentElement.scrollTop; //获取滚动部分的高度        var clientHeight = document.documentElement.clientHeight; //获取手机屏幕高度（可视部分高度）        var scrollHeight = app.scrollHeight; //所有内容的高度        if (          events.clientY > touchstartY &&          scrollTop === 0 &&          event.cancelable        ) {          event.preventDefault(); //禁止到顶下拉        } else if (          scrollTop + clientHeight > scrollHeight &&          event.cancelable        ) {          // event.preventDefault(); //禁止到底上拉        }      },      false    );

　　

代码实现在tree-hole-room-messages这个滚动区域内下拉不会出现。

且可用滚动这个区域