如何防止上下文菜单显示在 Chrome 的设备视图中

【问题标题】：How to prevent context menu from showing in Chrome's device view如何防止上下文菜单显示在 Chrome 的设备视图中
【发布时间】：2018-07-05 01:11:49
【问题描述】：

我有一个<input> onFocus 正在选择文本：

onFocusHandler = (event) => {
  event.currentTarget.select()
}

这在 Chrome 中运行良好，但是当我在“设备”模式下查看它时，每次选择文本时，上下文菜单都会在顶部显示“查找 ”。是否有其他方法可以选择不会执行此操作的文本？

【问题讨论】：

您是否尝试阻止 contextmenu 事件？
@СергейПетрашко 好建议！

标签： javascript html html-input

【解决方案1】：

根据Сергей Петрашко的评论，我试了一下：

<Input
  type="number"
  value={value || ''}
  onChange={this.onChangeHandler}
  onFocus={this.onFocusHandler}
  onContextMenu={e => e.preventDefault()}
  onUnfocusHandler={this.onUnfocusHandler}
/>

这会阻止上下文菜单显示。我还发现仅使用onClick 选择文本也不会显示上下文菜单（不会阻止onContextMenu 事件）。

【讨论】：

很高兴知道这一点，谢谢，但我也想警告未来的读者，如果你处理 onClick 但不要处理 onFocus 那么你不会得到如果您 tab 进入该字段，则选择的内容。我标签很多。