时间戳

首页 > 解决方案 > 在ios中使div不可选择

javascript - 在ios中使div不可选择

问题描述

我正在研究覆盖图像的可滚动视图。这样的视图由 2 个 div 组成，一个是scrollable，基本上是一个具有固定高度/宽度和溢出-y 的 div，另一个是content一个高度大于 的空 div scrollable。

我遇到的问题是长按它们会导致 ios 选择一个 div。我尝试user-select对它们进行设置，但没有成功。我不确定其中哪一个被选中，但我相信它是content。

需要注意的是，这两者都是通过编程方式创建的

const mytDiv = document.createElement('div')

并附在身体上。它们的样式通过设置

myDiv.style.cssText = "user-select: none;"

这是生成的基本html

<div class="scrollable" style="...">
  <div class="content" style="..."></div>
</div>

这是我在长按后看到的 ios 选择，即使user-select设置为“无”。

在此处输入图像描述

标签： javascripthtmlcss

解决方案

在 ios 和 safari 浏览器上，我相信是这样的。

-webkit-touch-callout : none
-webkit-user-select:none
//webkit-touch-callout : none: No callout option will be shown when the user's touch and holds on the element with this attribute.
//webkit-user-select : none: You cannot select text on Safari on macOS, if you do a right-click no options to copy is displayed.

如果您也想要所有其他浏览器：

-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
 user-select: none;

推荐阅读