如何在使用jQuery时删除Safari中的默认按钮突出显示

Question

我注意到在OS X上的Safari下，我的默认jQuery按钮似乎在它们周围有一个蓝色的高光。刚检查过，jQuery UI Demo page上发生了同样的事情。

在同一台机器上的Firefox下，它看起来像这样

任何人都可以告诉我在Safari下我可以做些什么来删除它？我仍然喜欢默认行为。

Answer 1

要删除任何浏览器可能作为默认操作应用的任何输入突出显示，您始终可以使用outline:none作为其CSS。在你的情况下，它是button元素。所以这应该有效：

button {
    outline: none;
}

Although it's not recommended to remove the CSS outline.因为它对可访问性不利。 （感谢Robin Clowers提到这个）

Answer 2

尝试使用此

在CSS中：

-webkit-tap-highlight-color: rgba(0,0,0,0);

在Javascript中：

document.addEventListener("touchstart", function(){}, true）;

Answer 3

*{
    outline: none;
}

.blah{
    outline-color: blue;
}

这不会影响现有的。 （.blah）这也适用于Google Chrome。

现场演示： http://jsfiddle.net/DerekL/TUbjc/

Answer 4

此按钮实际上定义了一个轮廓属性。你必须覆盖它。如果您在Firebug中检查它，您将看到此按钮的以下CSS声明：

.ui-dialog .ui-dialog-buttonpane button{outline:none;}