PC触摸屏滑动问题及禁止浏览器默认滑动行为

PC端触屏项目，滑动时会引发浏览器默认动作，比如左右滑动时，会触发浏览器的前进、后退行为，此外，浏览器还带有缩放行为，而一般情况下，项目中是不需要这些行为的，而单纯的禁用浏览器默认行为的代码，会影响浏览器的上下滚动等正当需求，因此需要对禁用默认行为的触发条件进行判断，代码如下：

let box = document.querySelector(".app-main");
    box.addEventListener("touchstart", function (e) {
        this.moving = true;
        this.clientXLast = e.touches[0].clientX;
        box.addEventListener("touchmove", function (e) {
          if (
            e.changedTouches[0].clientX - this.clientXLast > 100 ||
            e.changedTouches[0].clientX - this.clientXLast < -100
          ) {
            e.preventDefault();
          }
        });
      });
      box.addEventListener("touchend", function (e) {
        box.removeEventListener("touchmove", function (e) {
          if (
            e.changedTouches[0].clientX - this.clientXLast > 100 ||
            e.changedTouches[0].clientX - this.clientXLast < -100
          ) {
            e.preventDefault();
          }
        });
      });

上面代码就是当手指触摸到屏幕时，如果手指左右滑动的距离超过100，则禁用浏览器默认行为，而当手指离开时，恢复浏览器默认行为。