如何禁用移动浏览器（Chrome）中的 onclick 文本突出显示？

Question

基本上var cell = document.createElement("div")cell.innerHTML = `           <div style=" display: inline-block; width: 270px; height: 270px; background: url(yellowNote.jpg); background-repeat: no-repeat; background-size: cover;">               <textarea id="ff" style="border: unset; background: unset; resize: unset; width: 80%; height: 60% ; margin-top: 20px; margin-left: 17px; padding: 10px;"></textarea>               <div style="display:inline-block;">               <input id="mr"  type="date">               <input id="mc"  type="time">               </div>           </div>`基本上做同样的事情我怎样才能禁用它？我不想设置，user-select: none因为我需要让用户在长按时突出显示文本。

Answer 1

.disable-select {

  user-select: none; /* standard */

  -moz-user-select: none; /* firefox specific */

  -webkit-user-select: none; /* Chrome, Opera and Safari*/

  -ms-user-select: none; /* IE, ms-edge */

}

版本兼容性

desktop:

Chrome: 54+

Firefox: 69+

Opera: 41+ (15+ with vendor prefix)

Safari: 3+

MS Edge: 12+

IE: 10+

mobile

Chrome for Android: 54+

Android web-view: 54+

Firefox for Android: 4+

Opera for Android: 14+

Safari on IOS: 3+

请参阅来源以获取更多信息和版本兼容性。

Answer 2

我已经user-select: none为此修复了一段时间，发现它并不令人满意，所以我开始搜索该功能的正确名称，以便查看是否有更好的修复/编写，我遇到了这个 Google Developers Paul Kinlan 的帖子（显然该功能称为“触摸搜索”）：

https://developers.google.com/web/updates/2015/10/tap-to-search

其中详细描述了该行为以及禁用或启用该行为的各种方法。

与您的问题相关的相关摘录：

对于任何可选择且非交互式或不可聚焦的纯文本，都启用点击触发。当页面具有响应文本点击的点击处理程序时，触摸搜索会自动检测响应并忽略它，因为我们知道开发人员打算处理该事件。使用触摸并按住手势手动选择文本也会触发触摸搜索栏。用户可以使用 Chrome 隐私设置下的首选项来启用或禁用该功能。

作为网站的作者，您经常不希望在某些元素上点击手势来触发搜索。为了确保 Chrome 实现您的预期，请制作以下元素：

1. 可聚焦：在元素上添加 tabindex=-1 属性。

2. 交互式：使用几种标准方法中的任何一种来指示元素是交互式的：

• 使用辅助功能标记来指示元素具有小部件角色或小部件属性。例如，任何具有 role=button 的元素都不会触发。添加辅助功能标记还有一个额外的好处，即您的页面对于视障用户来说更容易阅读。

• 任何调用 PreventDefault() 或操作 DOM 或 CSS 的 JavaScript 单击处理程序都不会触发 Touch-to-Search。

3. 不可选择：使用 -webkit-user-select: none; 即使使用触摸并按住手势，不可选择的文本也不会触发触摸搜索。

Answer 3

通过添加role="dialog"到包装器中解决了我的问题。但我不知道为什么，谁能解释一下？

Answer 4

尝试这个：

-webkit-tap-highlight-color: transparent;