jquery摆脱按钮周围的虚线轮廓答案

【问题标题】：jquery Getting rid of dotted outline around buttonsjquery摆脱按钮周围的虚线轮廓
【发布时间】：2009-10-15 11:46:14
【问题描述】：

当您单击输入类型按钮时，我正在尝试消除 FF 中出现的虚线轮廓。此大纲不会出现在 Chrome 中。

我试过了：

.button {
    border:none;
    outline:none;
}
.button:active {
    border:none;
    outline:none;
}
.button:focus {
    border:none;
    outline:none;
}

这些都不起作用。有人知道真正的解决方案吗？谢谢。

编辑：寻找更好的解决方案。

onclick 使轮廓闪烁，如出现，然后在 mouseup 时消失。我尝试将模糊绑定到 mousedown 和 mouseup，但闪光灯仍然存在。

谁有更好的想法？

谢谢。

再次编辑：

解决方案适用于最新版本的 FF。看起来像修复了一个错误之类的。

【问题讨论】：

标签： jquery html css

【解决方案1】：

虚线轮廓是 Firefox 向用户指示哪个元素具有焦点的方式。如果您正在编写某种类型的客户端应用程序，其中单击按钮/链接/元素并且 DOM 未更改，那么您将看到 FF 的焦点轮廓。摆脱这种情况的唯一方法是 blur() 事件的目标元素。

这是一个关于如何使用 jquery 执行此操作的霰弹枪/矫枉过正的方法：

$(function() {
    $('.autoblur').live("click", function(event) {
        this.blur();
    });
});

【讨论】：

【解决方案2】：

你可以尝试添加一个 blur() 事件：

<input type="button" value="test" onclick="this.blur()" />

【讨论】：

你不应该像这样使用突兀的事件处理程序。