首页 > 移动平台 > 详细

移动端click事件无反应或反应慢 touchend事件页面滑动时频繁触发

时间:2019-03-21 17:36:15      阅读:206      评论:0      收藏:0      [点我收藏+]

H5页面的点击事件click 无论在浏览器 iframe还是小程序里面 都会出现点击无反应或者反应慢的情况出现

所以决定用touchend事件来代替click

但是touchend事件触发比较灵敏 在滑动页面时 如果不小心触碰有touchend事件的元素都会触发

尤其是在满屏都有touchend元素的页面中 只要稍有滑动都会触发该事件 很无奈

 

解决方法如下:

监听滑动事件 在滑动事件里面阻止touchend事件

   function stopTouchendPropagationAfterScroll() {

      var locked = false;

      window.addEventListener(‘touchmove‘, function() {
        locked || (locked = true, window.addEventListener(‘touchend‘, stopTouchendPropagation, true));
      }, true);

      function stopTouchendPropagation(ev) {
        ev.stopPropagation();
        window.removeEventListener(‘touchend‘, stopTouchendPropagation, true);
        locked = false;
      }
    }

    var divs = $(".go");
    stopTouchendPropagationAfterScroll();
    divs.on("touchend", function() {
      alert(‘触发touchend‘)
});

 

移动端click事件无反应或反应慢 touchend事件页面滑动时频繁触发

原文:https://www.cnblogs.com/luffyc/p/10573101.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!