防止默认按iOS而不是默认拖动iOS MobileSafari?

Jam*_*ker 14 webkit web-applications mobile-safari ipad touch-event

上下文:MobileSafari/iPad上的Web应用程序,全屏和嵌入在iframe中

目标:技术,提供自定义事件处理程序点击,但 (变焦)或拖动(滚动/锅).我们希望为Press提供自定义行为,但让Safari仍然可以处理滚动/平移/缩放.

问题:这两个目标似乎是相互排斥的.要防止Press手势的默认行为,必须立即响应ontouchstart调用event.preventDefault.但是,要让Drag上的默认行为继续,我们不能在初始ontouchstart上调用event.preventDefault.一旦调用了preventDefault,就无法在该手势序列中恢复默认行为(即直到所有手指都脱落).在发生某些移动之前,无法识别拖动.

拖动被说明是最简单的示例,但我们也关心获取Pinch和Double-tap的默认行为.我们从不想要"复制图像"的默认MobileSafari按行为或选择文本.

到目前为止的尝试:

  • 保存ontouchstart事件,并在超时后,稍后调用preventDefault(就在识别Press之前).没有效果.
  • 听' oncontextmenu '.不,默认的新闻行为不会通过此事件发出信号或路由.
  • 防止所有ontouch*处理程序中的默认值,然后当我们识别拖动/ 捏合手势时,使用initTouchEvent和/或initGestureEvent模拟新事件.以编程方式创建的事件命中了我们所有的回调,但Safari似乎不关注它们,没有触发默认行为.
  • 用假动作打破Safari的Press识别.Safari在最轻微的移动中取消了一次按下,但我们允许稍微倾斜.在ontouchstart之后模拟移动事件(如上所述)不会导致Safari无法识别按下如果手指没有"真实地"移动.

我们有一套全功能的手势识别器(以Javascript,ontouch*为单位),采用Apple 原生iOS手势识别器的风格.我们没有识别任何手势的问题,我们只是不知道复制Safari免费提供的缩放/平移/双击行为的好方法.

我们不需要代码; 我们正在寻找任何理论解决方案(除了"只是自己实现平移/缩放",但如果你有一种光滑的方式来做我们感兴趣的话),这将导致合理的成功.我们也有兴趣了解其他类似尝试这样做 - 当然我们不可能是第一个尝试这样做的人吗?

备用TL; DR:有没有办法阻止默认按下(也称为点击并保持)而不是触摸开始?

Jam*_*ker 19

成功:完全通过CSS而不是preventDefault来防止"默认按下"行为.这个答案由Safari Technologies Evangelist Vicki Murley这里提供(需要注册)

我在你的stackoverflow帖子中看到你说你的最终目标是:

"我们绝不希望默认的MobileSafari按"复制图像"行为或选择文字."

这些行为可以在CSS中禁用(+一个奖励属性,因为人们经常想要关闭突出显示,如果他们关闭这些其他行为):

/* behavior */
-webkit-user-select: none;                /* disable cut copy paste */
-webkit-touch-callout: none;              /* disable callout, image save panel */
-webkit-tap-highlight-color: transparent; /* "turn off" link highlight */
Run Code Online (Sandbox Code Playgroud)

评论:我们假设Safari的Press行为是基于事件的,不是由CSS驱动的.调用preventDefault ontouchstart确实会取消新闻行为(这导致我们误入歧途,真的如此),但这似乎是一种意想不到的副作用.实际上,Mobile Safari并没有像"新闻中的CSS"那样执行"新闻事件".

使用CSS禁用Press行为允许我们再次在我们实际需要的地方和时间再次调用preventDefault.