我有一个小应用程序，打算在iframe中运行。它设置自己的document.addEventListener('keydown', ...)事件以及"keypress"one_answers"keyup"。这是一款基于浏览器的小型游戏，应该在主页中运行。
当我直接在浏览器中(而不是在iframe中(运行它时，一切都很顺利。但一旦我把它放在另一个页面中，iframe就停止获取任何键盘事件。它仍然接收鼠标事件、触摸事件、窗口大小调整事件等等。除了keydown/keyup/keypress之外的所有内容。
我需要帮助。花了三天时间试图解决这个问题，但仍然不明白发生了什么。
附言：之前编译的相同react应用程序还可以，可以很好地与键盘等配合使用
我认为这是新React版本的一个特定版本(可能是bug或功能(，或者是新的有趣的"；"安全导向"；浏览器开发人员的限制。
请帮忙！
附言：我当前的依赖列表如下：
"dependencies": {
"@emotion/react": "^11.7.1",
"@emotion/styled": "^11.6.0",
"@mui/icons-material": "^5.2.5",
"@mui/material": "^5.2.5",
"@mui/styles": "^5.2.3",
"@types/react": "^17.0.38",
"@types/react-dom": "^17.0.11",
"cra-template": "1.1.2",
"jszip": "^3.6.0",
"npm": "^7.8.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-draggable": "^4.4.3",
"react-motion": "^0.5.2",
"react-multi-lang": "^2.1.1",
"react-redux": "^7.2.3",
"react-scripts": "^5.0.0",
"react-spring": "^9.4.1",
"redux": "^4.0.5",
"wp-auth": "^1.0.4"
},
和上一个(该应用程序运行良好(
"dependencies": {
"@material-ui/core": "^4.11.3",
"@material-ui/icons": "^4.11.2",
"@material-ui/utils": "^4.11.2",
"jszip": "^3.6.0",
"npm": "^7.8.0",
"react": "^16.14.0",
"react-dom": "^16.14.0",
"react-draggable": "^4.4.3",
"react-motion": "^0.5.2",
"react-multi-lang": "^2.1.1",
"react-redux": "^7.2.3",
"react-scripts": "3.2.0",
"react-spring": "^8.0.27",
"redux": "^4.0.5",
"wp-auth": "^1.0.4",
"yarn": "^1.22.10"
},
好吧，神秘主义者被发现了。
我已经将event.preventDefault()随机添加到我的mousedown事件处理程序中，它已经阻止了整个应用程序的聚焦功能。
简单地说，由于这个原因，应用程序从未得到关注，因此没有键盘事件可以工作。
从我的mousedown处理程序中删除了event.preventDefault()，现在一切都正常了！
希望我的愚蠢能帮助到别人：(