H5阻止IOS端橡皮筋效果

我这边是查阅资料，写了个JS版的函数：

  IOS_STOP_preventDefault() {
    let startY, endY;
    const scrollTop =
      document.documentElement.scrollTop || document.body.scrollTop;
    const clientHeight =
      document.documentElement.clientHeight || document.body.clientHeight;
    const scrollHeight =
      document.documentElement.scrollHeight || document.body.scrollHeight;
    document.addEventListener(
      'touchstart',
      function (e) {
        startY = e.touches[0].pageY;
      },
      { passive: false }
    );
    document.addEventListener(
      'touchmove',
      function (e) {
        endY = e.touches[0].pageY; //记录手指触摸的移动中的坐标
        //手指下滑，页面到达顶端不能继续下滑
        if (endY > startY && scrollTop <= 0) {
          e.preventDefault();
        }
        //手指上滑，页面到达底部不能继续上滑
        if (endY < startY && scrollTop + clientHeight >= scrollHeight) {
          e.preventDefault();
        }
      },
      { passive: false }
    );
  }

当我们判断当前环境是IOS环境时，在onload/onready/或各种框架生命周期里调用即可
原链接https://www.cnblogs.com/cuncu...