在Mobile Safari / Webkit的触摸屏上禁用文本高亮放大镜
我的iPhone网站上有一些没有任何文字的元素，但要求用户点击并按住它们（DIV）。 这会导致文本高亮显示/编辑循环/光标显示，这真的让人分心。
我知道有一个CSS规则，用于删除在点击元素时显示的黑框。 有没有这样的事情来禁用文本放大镜？
刚刚得到了开发人员中心帮助台的回复。 我需要添加这个CSS规则：
-webkit-user-select: none; 使用这个CSS代码
-webkit-touch-callout: none; -webkit-user-select: none; /* Disable selection/copy in UIWebView */
这对保护您不想复制或保存的内容（如图像）也很有用：
#yourdiv img {-webkit-touch-callout: none; }
我自己试了一下，发现了这一点。 首先你必须把这个规则添加到封闭的元素中：
-webkit-user-select: none;
但是，iPhone本身还不够。 事实certificate，放大镜仍然可以出现，因为，例如，父母的元素会接受select，或者只是因为它的感觉。
然而，我发现了一些很酷的东西 – 如果你的元素为元素添加了一个touchend和click处理程序，那么Apple的Safari最终会避免令人讨厌的代码path，导致放大镜出现，可能意识到这个元素是为了一些UI交互，而不是select文字。 同样真棒的说明，如果你在靠近屏幕顶部的元素上这样做，它也将取消在横向模式下导航的外观！ 不知道如何取消导航的外观，当点击底部的元素，没有人有一个解决scheme的那个？
JS解决了这个问题：
document.getElementsByTagName("body")[0].addEventListener("touchstart", function(e) { e.returnValue = false });
似乎绕过任何操作系统在那里接触。
将此添加到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' */}
