如何在 <选择> 字段中禁用输入键？

【问题标题】：How to disable enter press in <Select> field?如何在 <选择> 字段中禁用输入键？
【发布时间】：2021-03-25 02:31:51
【问题描述】：

我有这个元素：

<Select>
  <Option value='1'>1</Option>
  <Option value='2'>2</Option>
</Select>

我想在按下 Enter 时禁用表单提交。我用<Input> 字段尝试了以下操作：

<Input onPressEnter={disableEventHelper} />

disableEventHelper = (e) => e.preventDefault();

但是，由于某种原因，这不适用于<Select> 有没有其他方法可以做到这一点？

【问题讨论】：

你试过onKeyDown吗？

标签： javascript html reactjs forms

【解决方案1】：

在您的 Javascript 代码中尝试代码 sn-p：

window.addEventListener('keydown',function(event){
  if(event.keyCode == 13) {
      event.preventDefault();
      return false;
    }
});

但是，如果您只想定位您的表单，请执行以下操作：

假设你的表单有一个名为your-form的类：

const form = document.querySelector('.your-form');

form.addEventListener('keydown',function(event){
  if(event.keyCode == 13) {
      event.preventDefault();
      return false;
    }
});

【讨论】：

这会完全禁用整个页面上的 Enter 键。