当html组件被点击时隐藏焦点样式的问题

Issue in hiding focus styles when an html component is clicked

本文关键字：焦点 隐藏 样式 问题 html 组件      更新时间：2023-09-26

我正在创建一个输入组件。为了更好的用户体验，我在组件被单击时隐藏焦点样式(这是我在click事件处理程序中做的)。但在一个场景中，这并不能很好地工作:

  1. 点击组件
  2. 导航远离浏览器选项卡(我使用chrome)
  3. 返回浏览器选项卡

一旦你回到页面，焦点事件就会在上次聚焦的元素上触发，但由于click事件没有被触发，焦点样式就会回来。你不想要的东西

谁能建议一个好的修复这个

使用CSS删除/编辑样式。

input:focus {
    box-shadow: none;
    outline: none;
}
相关文章：