【问题标题】:touch events stop firing when dragging down on mobile Safari - ipad html5在移动 Safari 上向下拖动时,触摸事件停止触发 - ipad html5
【发布时间】:2012-08-09 17:55:20
【问题描述】:

当我添加事件侦听器来处理 touchmove 和 touchstart 等触摸事件时

        document.addEventListener("touchstart", function(event){
            event.preventDefault();
            document.getElementById("fpsCounter").innerHTML = "touch start";
            trace("touch start");
        }, false);
        document.addEventListener("touchmove", function(event){
            event.preventDefault();
            var x = event.touches[0].pageX - getCanvasOffset().offsetLeft; 
            var y = event.touches[0].pageY - getCanvasOffset().offsetTop;

            document.getElementById("fpsCounter").innerHTML = "touch touchmove "+x+"  "+y;
            trace("touch touchmove");
        }, false);
        document.addEventListener("touchend", function(event){
            event.preventDefault();
            document.getElementById("fpsCounter").innerHTML = "touch end";
            trace("touch touch end");
        }, false);
        document.addEventListener("touchcancel", function(event){
            event.preventDefault();
            document.getElementById("fpsCounter").innerHTML = "touch cancel";
            trace("touch touch cancel");
        }, false);

    }

touchMove 工作正常,直到我开始向下移动,因为整个 html 页面开始被 safari 向下滚动。当我释放时,html 页面会弹回原来的位置。 html 页面内的任何元素都不会溢出 ipad 的边界。 我怎样才能防止浏览器的拖动 html 页面功能?我尝试 event.preventDefault() 没有运气

【问题讨论】:

  • 我认为这不可能。 Mobilesafari 在页面滚动时冻结页面
  • 它必须是可能的,如果不是,那么您将无法使用html5进行拖放
  • 手机不能用,干扰太大

标签: javascript ipad html ios5 webkit


【解决方案1】:

您可以尝试取消事件(移动而不仅仅是使用 preventDefault)

event.cancelBubble = true;
event.returnValue = false;
if (event.stopPropagation) event.stopPropagation();
if (event.preventDefault) event.preventDefault();

【讨论】:

    猜你喜欢
    • 2011-12-15
    • 1970-01-01
    • 2011-08-24
    • 1970-01-01
    • 1970-01-01
    • 2018-04-28
    • 2019-02-07
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多