Javascript Keydown和Mouseclick调用相同的函数，但行为不同

我有一个react组件，由一个输入框、一个按钮和一个最初隐藏的结果框组成。有一个函数可以对RESTAPI进行异步调用，获取数据，并将其显示在结果框中，使其可见。我希望在单击按钮或按enter键时调用该函数

对于按钮单击，我有：

<button onClick={this.myFunc}>

为什么有两种不同的行为？我该如何解决这个问题

更新：myFunc中有一行内容关注导致此问题的结果框。在评论这一行时，Keydown和Mouseclick都可以正常工作。但我需要这一行来实现一个特性

document.getElementById("result-box").focus(); //tabindex is set to 0

有什么解决办法吗？

这里有一个代码

使用onkeypress，使其正常工作

功能键手柄{ ife.key==也输入{//keycode myFunc； } } 函数myFunc{ 控制台。记录“正在运行…” } JS-Bin 测验 键控

当用户按键时激发。当用户按下按键时，它会重复

按键

例如，在文本输入中插入实际字符时激发。当用户按下按键时，它会重复

钥匙

在执行某个键的默认操作后，当用户释放该键时激发

文本输入

---

当角色实际添加到控件时激发。因此，如果用户按字符键，但默认设置为onkeydown或onkeypress，则不会触发textinput事件，因为该序列不会导致添加字符。

在找出导致此问题的行之后，我更新了我的问题。由于您的帮助，使用onKeyPress更改onKeyDown/Up解决了我的问题。但是你能解释一下，当onKeyUp/Down无法处理而onKeyPress可以处理时，div在做什么吗？我对这种行为感到困惑，请查看我的下一个ans如果这有效，请接受ans，以便其他用户可以知道

style={{ visibility: this.state.isResultLoaded ? "visible" : "hidden" }} // For result box

document.getElementById("result-box").focus(); //tabindex is set to 0