html - 如何取消 HTML "onfocus"行为?

标签 html css onfocus

什么会导致浏览器在单击 HTML 元素时在其周围涂上“焦点光环”?

这是在使用元素 + CSS 样式来反射(reflect)按钮状态的自定义按钮栏(想想单选按钮)上发生的。单击其中一个 span 时,Chrome 会在其周围环绕一条橙色线,而 Firefox 则使用黑色虚线。

我知道这听起来很愚蠢-简单,而且可能确实如此,但它让我无法尝试确定这种行为的来源 - 对于某些人来说,这是整个应用程序中唯一遭受这种浏览器行为影响的组件。

关于在哪里/如何阻止浏览器执行此操作的任何想法?

FWIW,这是唯一的监听器附件,即使将其删除,行为也会继续:

  tab.addEventListener("mousedown", this.e_tabMouseDown, false) 

根据发布的建议,CSS 已被修改以包含这些添加内容: -webkit-用户选择:无; -khtml-用户选择:无; -moz-用户选择:-moz-none; -o-用户选择:无; 用户选择:无;

但问题依然存在。更具体地说,此行为不会突出显示任何选定的文本 - 它只是在不需要的地方绘制一个焦点框。

更新答案: 虽然上面建议的 CSS mods 将摆脱文本突出显示,但可以使用以下样式规则消除焦点“光环”: outline: none;

最佳答案

虽然链接帖子中建议的 CSS mods 将摆脱文本突出显示,但可以使用以下样式规则消除焦点“光环”:

大纲:无;

关于html - 如何取消 HTML "onfocus"行为?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16822033/

相关文章:

html - CSS 使用 :target selector 更改整个表格行的背景颜色

jQuery:如何判断选项卡/窗口何时获得焦点

html - 如何为类和属性值创建 CSS 选择器?

javascript - 是否会报警?

javascript - 如何在文本框中插入值以选择选项

jquery - 用 CSS 消除父元素?

html - CSS :focus-visible for custom control

javascript - 如何防止onfocus后自动onmouseover?

javascript - 优化 React 应用程序 - 仅根据 React [React.JS]

html - 单击带有详细信息和摘要标签的展开