我的 iPhone 网站中有一些元素没有任何文本，但需要用户单击并按住它们 (DIV)。这会导致文本突出显示/编辑循环/光标出现，这真的很分散注意力。
我知道有一条 CSS 规则可以删除可点击元素被触摸时出现的黑框。有没有类似的东西可以禁用文本放大镜？
【问题讨论】：
刚收到开发者中心服务台的回复。我需要添加这个 CSS 规则：
-webkit-user-select: none;
【讨论】：
longPressDelay 也在选择部分日历）。
将此添加到 CSS 中
body {
-webkit-touch-callout: none; /* prevent callout to copy image, etc when tap to hold */
-webkit-text-size-adjust: none; /* prevent webkit from resizing text to fit */
-webkit-user-select: none; /* prevent copy paste, to allow, change 'none' to 'text' */}
【讨论】：
使用这些 CSS 规则：
-webkit-touch-callout: none;
-webkit-user-select: none; /* Disable selection/copy in UIWebView */
【讨论】：
这对于保护您不想复制或保存的内容（例如图像）也很有用：
#yourdiv img {-webkit-touch-callout: none; }
【讨论】：
这在 JS 中为我解决了这个问题：
document.getElementsByTagName("body")[0].addEventListener("touchstart",
function(e) { e.returnValue = false });
似乎绕过了操作系统中的任何东西来捕捉触摸。
【讨论】：
我在自己尝试时发现了这一点。首先，您必须将此规则添加到封闭元素：
-webkit-user-select: none;
但这在 iPhone 上是不够的。事实证明，放大镜仍然可以出现，例如，因为父元素会接受选择，或者只是因为感觉像它。
然而，我随后发现了一些很酷的东西——如果你的元素向一个元素添加了 touchend 和 click 处理程序，那么 Apple 的 Safari 最终避免了导致放大镜出现的烦人的代码路径，可能意识到这个元素用于某些 UI 交互，而不是选择文本。同样令人敬畏的是，如果您在屏幕顶部附近的元素上执行此操作，它还将取消横向模式下导航的外观！但是不确定如何在单击底部元素时取消导航的外观，有没有人有解决方案？
【讨论】：
contentEditable——除非我错过了一些东西。
在 IOS 15.2 上 -webkit-user-select: none; 解决了这个问题，但只是部分解决了。
长按不再显示放大镜。但是，如果您双击并按住它，它仍然会神奇地出现。
除了 touchstart 上的event.preventDefault 之外，仍然没有 100% 可靠的方法。但这也阻止了底层操作，因此带有长按工具提示的按钮之类的东西会中断。因此，它并不总是一种选择......
【讨论】：