强制元素在焦点变化时保持可见，即使它们在模糊时消失

如何解决强制元素在焦点变化时保持可见，即使它们在模糊时消失

在 Material UI 中，有一个自动完成功能。当我聚焦输入并按下向上/向下时，将显示选项。

我想使用右键单击 -> Inspect（在 Chrome 中）检查这些选项。但是一旦焦点离开输入，选项就会消失（而且我在 DOM 中找不到它们），可能是因为 onBlur 或类似的 JavaScript 事件。

https://material-ui.com/components/autocomplete/

有没有办法让选项保持可见，即使焦点离开输入，我也可以检查它们的 DOM？

解决方法

在 chrome 开发者工具 -> 元素选项卡中，在 input 元素或 attribute modifications 的父元素之一上添加一个 DOM 断点（我在某个父元素上做了）。事件触发后，单击恢复脚本执行（或直接按 F8），直到下拉菜单出现在屏幕上，但不要完成所有脚本执行，如果您保持在调试模式下会更容易。当下拉菜单出现时，只需再次打开 Elements 选项卡，在 DOM 树底部的关闭 </body> 标记之前找到下拉标记

,

我需要它只是为了检查，您可以将 open 属性添加到 Autocomplete 元素。

<Autocomplete
   ...
   open
/>

,

如果只是在开发工具中进行检查，您可以强制元素行为聚焦，然后在此基础上进行检查。