防止点击并按住选择附近的文本
Preventing tap-and-hold from selecting nearby text
如果用户点击并按住 iOS 和 Android,浏览器的本机行为是突出显示最近的 select 可用文本。
我正在构建一个网络应用程序,其中有一个类似于 iOS 股票应用程序中的图表的图表,您可以在其中点击图表以获取有关特定点的详细信息,然后沿着图表滑动手指有关不同点的详细信息。
交互工作正常,但是当用户点击并按住时,两个平台仍然select显示图表下方的文本。
我正在使用 touchstart
事件开始交互,并更新显示在
touchmove
期间的图表。这两个事件调用 stopPropagation()
和 preventDefault()
.
我可以做些什么来告诉浏览器不要 select 图表下方的文本吗?
注意:我不想在图表下方的文本上设置 user-select: noselect
,因为我 do 希望文本可以 select 否则.此外,这些图表可以四处移动,我不会总是知道它们下面的文字。
如果有帮助,这是我正在谈论的 UI 拍摄于 iOS 的图像。此屏幕截图是在我点击并按住图表后拍摄的。如您所见,它突出显示了 "Withdrawals"。同样的行为发生在 Android.
可行的解决方案:在调用 touchstart 时在您的文档中添加 user-select: noselect
,然后将其删除
与所有浏览器兼容的前缀user-select compatibility for browsers
如果用户点击并按住 iOS 和 Android,浏览器的本机行为是突出显示最近的 select 可用文本。
我正在构建一个网络应用程序,其中有一个类似于 iOS 股票应用程序中的图表的图表,您可以在其中点击图表以获取有关特定点的详细信息,然后沿着图表滑动手指有关不同点的详细信息。
交互工作正常,但是当用户点击并按住时,两个平台仍然select显示图表下方的文本。
我正在使用 touchstart
事件开始交互,并更新显示在
touchmove
期间的图表。这两个事件调用 stopPropagation()
和 preventDefault()
.
我可以做些什么来告诉浏览器不要 select 图表下方的文本吗?
注意:我不想在图表下方的文本上设置 user-select: noselect
,因为我 do 希望文本可以 select 否则.此外,这些图表可以四处移动,我不会总是知道它们下面的文字。
如果有帮助,这是我正在谈论的 UI 拍摄于 iOS 的图像。此屏幕截图是在我点击并按住图表后拍摄的。如您所见,它突出显示了 "Withdrawals"。同样的行为发生在 Android.
可行的解决方案:在调用 touchstart 时在您的文档中添加 user-select: noselect
,然后将其删除
与所有浏览器兼容的前缀user-select compatibility for browsers