手势在文本区域或输入中开始时的触摸动作行为

问题描述

似乎手势从textareainput开始时,touch-action被忽略了。这对我来说是意外的。预期的行为:touch-action已考虑在内,例如滚动不会发生(请参见下面的演示)。

演示:https://jsfiddle.net/1x8pc5ed/1/(打开桌面浏览器开发人员工具并激活触摸模拟,或者只是在手机上将其打开,然后尝试从textarea,{{1 }}和其他领域进行比较。)

我已经在Firefox和Chrome中对其进行了测试:

  • Chrome仅在input情况下忽略touch-action
  • textareatouch-action情况下,Firefox忽略input

任何人都可以解释这种行为吗?对我来说,这似乎是个错误

解决方法

关于textarea案:

这可能不是错误,而是预期的行为。

根据https://w3c.github.io/pointerevents/#determining-supported-touch-behavior

如果触摸行为符合经命中测试的元素及其最近祖先之间具有默认触摸行为的每个元素的触摸动作属性(包括经命中测试的元素和具有默认触摸行为的元素),则支持触摸行为

即在这种情况下,链条会在textarea上开始和结束,因为textarea可能具有默认的触摸行为(可能可以滚动)。

overflow: hidden上应用touch-action: nonetextarea可以防止滚动。